CSS와 관련된 팁이 있는 곳입니다. 좋은 자료 공유해 주세요.
글 수 1
0
조회 수 : 3235 신고 : 0
미리보기 : |
---|
반응형웹을 제작하면서 해상도에 따른 CSS를 호출하는 두가지 방법입니다.
해상도 따라 CSS 호출하기 (작성하신 수치에 따라 해당 CSS를 호출합니다.)
<!-- phone -->
<link href="phone.css" rel="stylesheet" type="text/css" media="only screen and (max-width:320px)" />
<!-- tablet -->
<link href="tablet.css" rel="stylesheet" type="text/css" media="only screen and (min-width:321px) and (max-width:768px)" />
<!-- pc -->
<link href="pc.css" rel="stylesheet" type="text/css" media="only screen and (min-width:769px)" />
해상도에 따라 해당 소스를 우선적으로 읽혀드립니다.
<!-- phone -->
@media (max-width:320px){
}
<!-- tablet -->
@media (min-width:321px) and (max-width:768px){
}
<!-- pc -->
@media (min-width:769px){
}
참고로 익스9미만 버전에서는 미디어쿼리를 지원하지 않기때문에 그이하 버전에서는 PC버전으로 CSS를 호출하시면됩니다.
<!--[if lt IE 9]><link href="pc.css" rel="stylesheet" type="text/css" /><![endif]-->
소중한 댓글 부탁드립니다.
추천수 10단위당 메달이 1개씩 노출되고, 추천수에 따라 배경색이 변하며, 일정수의 추천수를 받을시
아이콘이 붙게됩니다.
추천수 10단위당 메달이 1개씩 노출되고, 추천수에 따라 배경색이 변하며, 일정수의 추천수를 받을시
![BEST](/modules/board/skins/xe_webmini/img/common/icon_bestreply.gif)
추천수에 따른 배경색 보기
본문으로 바로가기
- 추천수 50개이상
- 추천수 30개이상
- 추천수 20개이상
- 추천수 10개이상
- 추천수 3개이상
![](/modules/board/skins/xe_webmini/img/pc_emot_co.gif)
첫번째 댓글을 남겨주세요!