>  기사  >  웹 프론트엔드  >  부트스트랩을 적응시키는 방법

부트스트랩을 적응시키는 방법

藏色散人
藏色散人원래의
2019-07-16 10:56:392436검색

부트스트랩을 적응시키는 방법

bootstrap 적응 방법

bootstrap 화면 Adaptation

Bootstrap에서 개발한 웹사이트를 모바일 친화적으로 만들고 적절한 그리기 및 터치 스크린 크기 조정을 보장하려면 웹 페이지 헤드에 뷰포트 메타 태그를 추가해야 합니다. 아래와 같이:

<meta name="viewport" content="width=device-width, initial-scale=1.0">

width 속성은 장치의 너비를 제어합니다. 귀하의 웹 사이트가 다양한 화면 해상도를 가진 장치에서 볼 것이라고 가정하면, 이를 장치 너비로 설정하면 다른 장치에서도 올바르게 렌더링됩니다.

initial-scale=1.0 은 웹페이지가 로드될 때 크기 조정 없이 1:1 비율로 렌더링되도록 합니다.

모바일 브라우저에서는 뷰포트 메타 태그에 user-scalable=no를 추가하여 확대/축소를 비활성화할 수 있습니다.

일반적으로 maximum-scale=1.0은 user-scalable=no와 함께 사용됩니다. 확대/축소를 비활성화하면 사용자는 스크롤만 할 수 있으므로 웹사이트가 기본 앱처럼 보입니다.

<meta name="viewport" content="width=device-width, 
                                     initial-scale=1.0, 
                                     maximum-scale=1.0, 
                                     user-scalable=no">

관련 추천: "부트스트랩 튜토리얼"

위 내용은 부트스트랩을 적응시키는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.