모바일에 적합한 웹페이지 효과로 작은 디스플레이 페이지_HTML/Xhtml_웹페이지 제작 문제 해결

업무상 휴대폰에 맞는 웹페이지 효과를 만들어야 하는데 드디어 구해서 공유하고 먼저 녹음해봅니다!

사실 가장 중요한 것은 HTML 페이지 선언을 변경하는 것입니다.

웹 페이지에 다음 코드를 추가하면 정상적으로 표시됩니다.

코드 복사

코드는 다음과 같습니다.

설명:

너비 - 너비 뷰포트
높이 - 뷰포트 높이
초기 배율 - 초기 배율 비율
최소 배율 - 사용자가 확대/축소할 수 있는 최소 배율
최대 배율 - 최대 scale 사용자가 확대/축소할 수 있음
user-scalable - 사용자가 수동으로 확대/축소할 수 있는지 여부

간단하게 하기 위해 위 코드를 다음 코드로 변경할 수 있으며 효과는 동일합니다.

코드 복사

코드는 다음과 같습니다.

마지막으로 특정 너비 속성을 너무 크게 설정하지 않는 것이 좋습니다. 예를 들어, 너비 속성을 웹 페이지에서 Body를 1000px로 설정하면 확실히 작동하지 않지만 화면 적응형인 90%로 설정할 수 있습니다.

PS: 휴대폰에서 정상적으로 표시될 수 있는 효과 페이지를 만들었습니다.