반응 형 웹 디자인을 실현하기 위해 CSS의 뷰포트 메타 태그에서 width = device-width를 <meta name="viewport" content="width=device-width">과 같이 설정하여 페이지 폭을 기기 너비와 동일하게 설정하여 사용자가 스크롤하지 않아도되도록합니다 페이지를 보지만 높이는 어떨까요? 브라우저가 너비를 기반으로 높이를 추측하고 장치 높이로 만드나요 ???CSS의 뷰포트 메타 태그
<meta name="viewport" content="width=device-width, initial-scale=1">
width=device-width 부분은 장치의 화면 폭에 따라 페이지의 폭을 설정합니다
대답하는 웹 사이트에 대한 올바른 meta 태그는 다음과 같다. initial-scale=1 부분은 브라우저가 페이지를 처음로드 할 때 초기 확대/축소 레벨을 설정합니다. window 치수는 항상 변경시 둘 다 조정되므로 특정 높이를 설정할 필요가 없습니다. 당신이 더 의심이있는 경우
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1">
meta 태그의 내용을 변경할 수 있습니다.
아직 보았지만 initial-scale = 1은 나에게 명확하지 않습니다. 콘텐츠 크기가 웹 페이지 크기와 동일하다는 것을 의미합니까? 그래서 확대/축소가 필요하지 않습니까? – titlu
'width '를'device-width'와'initial-scale = 1'과 동일하게 설정하면 윈도우가 장치 화면의 크기와 같고 눈금이 100 %라는 것을 의미합니다 (즉, 확대/축소 할 필요가 없음). 화면 크기를 변경하면 폭이 장치 크기와 결합되어 크기가 항상 동일하게 유지되므로 크기도 변경됩니다. –
<meta name="viewport" content="width=device-width, initial-scale=1">
width 속성은 뷰포트의 크기를 제어합니다. width = 600과 같은 특정 수의 픽셀 또는 100 % 스케일의 CSS 픽셀 단위의 화면 너비 인 특수 값 device-width로 설정할 수 있습니다. (해당하는 높이와 장치 높이 값이 있습니다. 뷰포트 높이를 기준으로 크기 나 위치가 변경되는 요소가있는 페이지에 유용 할 수 있습니다.)
이 부분을 읽은 다음 모든 항목을 선택하십시오.
'content = "width = device-width, initial-scale = 1"'을 변경하면 높이가 너비와 결합됩니다. –
ok .. 그렇다면 높이도 기기 높이와 동일할까요? – titlu
내용에 따라 높이가 증가합니다. –