<!-- html document --> <meta name="viewport" content=" height = [pixel_value | device-height] , width = [pixel_value | device-width ] , initial-scale = float_value , minimum-scale = float_value , maximum-scale = float_value , user-scalable = [yes | no] , target-densitydpi = [dpi_value | device-dpi | high-dpi | medium-dpi | low-dpi] " />
width
뷰포트의 크기를 제어하고 다음과 같은 값이나 특수 값을 지정할 수 있습니다. device-width 100% 크기 조정 시 CSS 픽셀 단위의 장치 너비입니다.
는 너비에 해당하고 높이를 지정합니다.
화면 픽셀 밀도는 화면 해상도에 의해 결정되며 일반적으로 인치당 도트 수(dpi)로 정의됩니다. Android는 낮은 픽셀 밀도, 중간 픽셀 밀도, 높은 픽셀 밀도의 세 가지 화면 픽셀 밀도를 지원합니다. 픽셀 밀도가 낮은 화면은 인치당 픽셀 수가 더 적은 반면, 픽셀 밀도가 높은 화면은 인치당 픽셀이 더 많습니다. Android 브라우저 및 WebView 기본 화면은 중간 픽셀 밀도입니다.
다음은 target-densitydpi 속성의 값 범위입니다
device-dpi - 장치의 원래 dpi를 대상 dp로 사용합니다. 기본 크기 조정이 발생하지 않습니다.
high-dpi – hdpi를 대상 dpi로 사용합니다. 중간 픽셀 밀도와 낮은 픽셀 밀도 장치는 그에 따라 축소됩니다.
medium-dpi - mdpi를 대상 dpi로 사용합니다. 픽셀 밀도가 높은 장치는 그에 따라 확장되고, 픽셀 밀도가 있는 장치는 그에 따라 축소됩니다. 이것이 기본 목표 밀도입니다.
low-dpi - mdpi를 목표 dpi로 사용합니다. 중간 픽셀 밀도와 높은 픽셀 밀도 장치는 그에 따라 확장됩니다.
1 <!-- html document --> 2 <meta name="viewport" content="target-densitydpi=device-dpi" /> 3 <meta name="viewport" content="target-densitydpi=high-dpi" /> 4 <meta name="viewport" content="target-densitydpi=medium-dpi" /> 5 <meta name="viewport" content="target-densitydpi=low-dpi" /> 6 <meta name="viewport" content="target-densitydpi=200" />
Android 브라우저와 WebView가 다양한 화면의 픽셀 밀도에 따라 페이지 크기를 조정하는 것을 방지하려면 뷰포트의 target-densitydpi를 device-dpi로 설정할 수 있습니다. 이렇게 하면 페이지 크기가 조정되지 않습니다. 대신 페이지는 현재 화면의 픽셀 밀도에 따라 표시됩니다. 이 경우 페이지가 화면에 맞도록 뷰포트의 너비를 장치의 너비와 일치하도록 정의해야 합니다.
초기 규모 조정. 즉, 페이지의 초기 확대/축소 수준입니다. 이는 페이지 크기의 승수인 부동 소수점 값입니다. 예를 들어, 초기 배율을 "1.0"으로 설정하면 웹 페이지가 표시될 때 목표 밀도 해상도의 1:1로 표시됩니다. "2.0"으로 설정하면 페이지가 2배로 확대됩니다.
최대 확대/축소. 즉, 허용되는 최대 크기 조정 수준입니다. 이는 화면 크기와 비교한 페이지 크기의 최대 배수를 나타내는 부동 소수점 값이기도 합니다. 예를 들어 이 값을 "2.0"으로 설정하면 페이지가 대상 크기에 비해 최대 2배까지 확대될 수 있습니다.
사용자 조정 가능 크기 조정. 즉, 사용자가 페이지의 확대/축소 수준을 변경할 수 있는지 여부입니다. yes로 설정하면 사용자가 이를 변경할 수 있으며, 그렇지 않으면 no입니다. 기본값은 예입니다. no로 설정하면 크기 조정이 전혀 불가능하므로 최소 크기와 최대 크기가 모두 무시됩니다.
모든 스케일링 값은 0.01~10 범위 내에 있어야 합니다.
예:
(화면 너비를 기기 너비로 설정하고 사용자가 수동으로 확대/축소 조정하는 것을 금지)
(화면 밀도를 고주파, 중주파, 저주파로 설정하면 자동으로 스케일링이 되며, 사용자가 스케일을 수동으로 조정하는 것을 금지합니다)
위 내용은 HTML5 개발의 뷰포트 화면 적응의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!