부트스트랩의 그리드 시스템은 어떤 용도로 사용되나요?

부트스트랩에서 그리드 시스템의 역할은 동일한 페이지 세트가 서로 다른 해상도를 가진 장치에 적용되도록 허용하는 것입니다. 시스템은 각 행을 평균 12개의 그리드로 나눈 다음 동일한 요소가 다른 숫자를 차지하도록 지정합니다. 다양한 장치에 그리드를 배치하여 다양한 장치에 대한 페이지 레이아웃을 실현합니다.

이 튜토리얼의 운영 환경: Windows 10 시스템, 부트스트랩 버전 3.3.7, DELL G3 컴퓨터

부트스트랩 그리드 시스템의 용도는 무엇입니까? 1. 부트스트랩 그리드 시스템: 기능은 다음과 같습니다. 동일한 페이지 집합이 서로 다른 장치 해상도에 적응합니다

2. 그리드 시스템 구현: 각 행을 12개의 그리드로 나눈 다음 동일한 요소가 모바일 장치와 PC 장치에서 서로 다른 수의 그리드를 차지하도록 지정합니다. 예: div는 컴퓨터 그리드에서 4개를 차지하며 휴대폰

3. 단계

1. 컨테이너 정의: 테이블 table

*컨테이너 분류:

1.컨테이너: 고정 너비 다양한 장치에 따라 다름(비워두기)

2.container-fluid: 100%

2. 행 정의: tr 스타일과 동일: row

3. 요소 정의: 다양한 장치에서 요소가 차지하는 그리드 수를 지정합니다. . 스타일: col-장치 코드-그리드 수

*장치 코드:

1.xs: 초소형 화면 휴대폰(768px): col-xs-12

2.sm: 소형 화면 태블릿(>= 768px)

3.md: 중형 데스크탑 모니터(>=992px)

4.lg: 대형 스크린 데스크탑 모니터(>=1200px)

**참고: 연속된 그리드 수가 12개를 초과하는 경우 , 초과 부분 자동 줄바꿈

**참고: 정의된 클래스 속성은 상위 호환되지만 하위 호환되지 않습니다. 장치의 너비가 설정한 그리드 클래스 속성의 장치 코드 최소값보다 작을 경우, 요소는 기본적으로 전체 행을 하나의 공간으로 채웁니다.

관련 권장 사항:

부트스트랩 튜토리얼

위 내용은 부트스트랩의 그리드 시스템은 어떤 용도로 사용되나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!