CSS viewport 기기별 가로 사이즈 정리
페이지 정보
본문
viewport 기기별 가로 사이즈 정리 합니다.
[code]
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<!-- 뷰포트메타태그 -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>미디어쿼리</title>
<style>
/* 모든기기공통 CSS */
body{ background-color: orange; }
/* desktop 규격 */
@media screen and (min-width: 1024px){
body{ background-color: lightblue; }
}
/* tablet 규격 */
@media screen and (max-width: 1023px){
body{ background-color: pink; }
}
/* mobile 규격 */
@media screen and (max-width: 540px){
body{ background-color: navy; }
}
</style>
</head>
<body>
</body>
</html>
[/code]
- 이전글
- 다음글
댓글목록
등록된 댓글이 없습니다.