HTML:head: 두 판 사이의 차이
둘러보기로 이동
검색으로 이동
(→개요) |
|||
19번째 줄: | 19번째 줄: | ||
<br /> | <br /> | ||
== 반응형 페이지 만들기 == | ==반응형 페이지 만들기== | ||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, minimum-scale=1.0> | <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, minimum-scale=1.0> | ||
뷰포트 설정으로 기기 크기에 맞추어 창을 설정할 수 있다. 보통 style과 연동하여 width:45%; max-width:250px; 등의 조건을 주어 설정한다. | |||
{| class="wikitable" | {| class="wikitable" | ||
|+ | |+ | ||
36번째 줄: | 38번째 줄: | ||
|} | |} | ||
=== css === | ===css=== | ||
1240px보다 작아질 때 적용하는 방식이다. 틀의 위치, 형태 따위를 창 크기에 따라 조절할 수 있다.<syntaxhighlight lang="css"> | 1240px보다 작아질 때 적용하는 방식이다. 틀의 위치, 형태 따위를 창 크기에 따라 조절할 수 있다.<syntaxhighlight lang="css"> | ||
@media screen and (max-width:1240px){ | @media screen and (max-width:1240px){ |
2021년 6월 18일 (금) 12:34 기준 최신판
틀:HTML HTML에 대한 문서들 모음집
개요[편집 | 원본 편집]
페이지 전체를 아우르는 정보를 담아놓는 공간이다. 여기에 대한 것들을 다뤄본다.
페이지 이름[편집 | 원본 편집]
title 태그로 페이지의 이름을 지정할 수 있다.
<title>지나니네</title>
파비콘[편집 | 원본 편집]
페이지 이름 앞에 자그마하게 뜨는 아이콘. .ico 확장자를 담는다.
일반적으로 16x16크기가 표준이며, 이미지를 파비콘으로 변환해주는 사이트도 있다.(https://www.convertico.com/)
<link rel="shortcut icon" href="경로.ico">
반응형 페이지 만들기[편집 | 원본 편집]
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, minimum-scale=1.0>
뷰포트 설정으로 기기 크기에 맞추어 창을 설정할 수 있다. 보통 style과 연동하여 width:45%; max-width:250px; 등의 조건을 주어 설정한다.
옵션 | 설명 |
---|---|
initial-scale=1.0 | 처음 크기 |
minimum-scale=1.0 | 최소 크기 |
css[편집 | 원본 편집]
1240px보다 작아질 때 적용하는 방식이다. 틀의 위치, 형태 따위를 창 크기에 따라 조절할 수 있다.
@media screen and (max-width:1240px){
#선택자...
display:none;
}