안녕하세요.
타임콜을 한의원 상황에 맞게 CSS를 수정해 보려는 과정에서,
CSS설정으로 들어갈 수 있는 톱니바퀴 모양이 사라져 버렸습니다.
-환자의 배치는 대기실 컴으로 하고, 타임콜은 치료실에서 오직 타이머로만 사용하려고 했습니다.
-치료버튼 크기를 늘리고, 대기환자들 창은 모두 삭제하고, 신상메모창과 치료지시창도 삭제
-이 과정에서 톱니바퀴 아이콘이 사라져 버리고 전체 모양도 이상해졌습니다
다시 초기화 하려고 해도, 설정으로 들어갈 수가 없으니,..
어떻게 해야 할까요?
7인치 타블렛을 치료실 벽면에 배치해놓고, 타임콜로 사용했으면 합니다.
베드가 총 10개인데, PC 모니터 상에서는 한 화면에 모두 표시가 되나,
7인치 타블렛에서는 베드가 1개 또는 2개만 표시되고, 나머지는 스크롤을 해야 합니다.
혹시, 베드 하나에 대한 박스 크기를 줄여서,
(박스 크기나 그 안의 글자 크기가 작아지더라도)
10개의 베드를 스크롤 없이 모두 한 화면에 표시할 수 있는 방법은 없을까요?
CSS 검색해보니, @media라는 명령어가 있던데, 그런 걸 활용하면 가능한가요?
아니면 아예 불가능한건가요?
배경 지식이 없다보니, 질문을 맞게 한 건지 모르겠네요... 방법이 있을까요?
네 맞습니다. css에 @media를 사용하면 화면크기에 따라 설정을 달리 할 수 있습니다.
예를 들어 )
@media (max-width:360px){
html{font-size:15pt;}
input{height:35px;}
#MAIN{padding-left:10px;}
.Title{font-size:15pt;}
}
@media (min-width:361px) and (max-width:414px){
html{font-size:16pt;}
input{height:35px;}
#MAIN{padding-left:10px;}
.Title{font-size:16pt;}
}
@media (min-width:415px) and (max-width:767px){
html{font-size:16pt;}
input{height:35px;}
#MAIN{padding-left:10px;}
.Title{font-size:17pt;}
}
@media (min-width:768px) and (max-width:1024px){
html{font-size:16pt;}
input{height:35px;}
#MAIN{ text-indent:-20px; padding-left:30px; }
.Title{font-size:18pt;}
}
@media (min-width:1025px){
html{font-size:14pt;}
input{height:35px;}
#MAIN{ text-indent:-20px; padding-left:30px; }
.Title{font-size:19pt;}
}
id=MAIN -> #MAIN
class=Title -> .Title
기본tag -> html,input,select... 등
이렇게 사용하시면됩니다.
C:APM_Setuphtdocscodipcapps xroom 안에 style.css파일을 style.css.bak 등으로 백업하시고
다시 구동하면 초기화된 style.css가 재생성됩니다.