부트스트랩 펜스 시스템 CSS에서 col-xs-*, col-sm-*, col-md-*의 의미는 디스플레이 화면의 너비에 따라 해당 클래스 스타일을 자동으로 선택한다는 것입니다:
.col-xs- 초소형 화면 휴대폰(<768px)(추천 학습: Bootstrap 비디오 튜토리얼)
.col-sm- 소형 화면 태블릿(≥768px)
.col-md- 중형 화면 데스크톱 모니터(≥992px)
.col-lg- 대형 화면 데스크톱 모니터(≥1200px)
우선:
1, col-column,
2, xs-maxsmall, super small; sm-medium, Medium;
3, -*는 열을 차지하는 것을 의미합니다. 즉, 각 행을 12개의 열로 자동으로 나누는 그리드 시스템 비율을 차지합니다. 4, col- xs-*초소형 화면 휴대폰(<768px),
.col-sm-*소형 화면 태블릿(≥768px),.col-md-*중형 화면 데스크톱 모니터( ≥992px) (게이트 그리드 매개변수).
5. 화면 종류에 관계없이 그리드 시스템은 자동으로 각 행을 12개의 열로 나누고 매개변수 뒤에 col-xs-* 및 col-가 표시됩니다. sm-* 및 col-md-* 현재 화면에서 각 div가 차지하는 열 수입니다.
예를 들어
6. 반대로 작은 화면에 3개의 div를 나란히 표시하려면(12/3 = 각각 4개의 열을 차지함) 큰 화면에 6개의 div를 표시합니다(12/6). = 각각 2개의 열을 차지함), col-md-2를 사용하면 원하는 조판을 제어할 수 있습니다.
Bootstrap과 관련된 더 많은 기술 기사를 보려면
Bootstrap Tutorial위 내용은 부트스트랩 col-sm col-md 차이의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
