[前端] 前端bootstrap col-xs-6 col-md-3的布局意思

bootstrap布局是栅格系统

页面分为12格子

 

col-6  表示占6格

col-3表示占3格

 

v5版本的新表示

 

 xs
<576px		sm
≥576px		md
≥768px		lg
≥992px		xl
≥1200px		xxl
≥1400px
Container max-width None (auto) 540px 720px 960px 1140px 1320px
Class prefix .col- .col-sm- .col-md- .col-lg- .col-xl- .col-xxl-

 

实测-md就是大于768px

col后面啥也不写，就是小于768px

例如下面的布局

大于768px 占四分之一

 

 

 

小于768px 占一半

 

posted @   唯一客服系统开发笔记  阅读(393)  评论(0)  编辑  收藏  举报
相关博文：
· [CSS] css中display: table-cell 实现垂直居中
· [CSS] media query媒体查询中的min-width和max-width
· col-xs , col-sm , col-md , col-lg
· bootstrap前端基础知识纪录
· bootstrap container row col
阅读排行：
· 阿里最新开源QwQ-32B，效果媲美deepseek-r1满血版，部署成本又又又降低了！
· 开源Multi-agent AI智能体框架aevatar.ai，欢迎大家贡献代码
· Manus重磅发布：全球首款通用AI代理技术深度解析与实战指南
· 被坑几百块钱后，我竟然真的恢复了删除的微信聊天记录！
· AI技术革命，工作效率10个最佳AI工具
历史上的今天：
2021-01-18 [javascript] vue和elementui中的键盘事件
2019-01-18 [Go] 使用go语言解决现代编程难题
2019-01-18 [MySQL]select和where子句优化
2018-01-18 [PHP] 通用网关接口CGI 的运行原理
点击右上角即可分享
微信分享提示
AI IDE Trae
1
chat with us