为什么需要写col-1 ~col-12这么多
之前媒体查询那节课每个@media 写一个width的比例就够了，为什么这里写12个这么多
.col {
width: 100%;
}
@media (min-width:576px){
.col {
width: 50%;
}
}
@media (min-width:768px){
.col {
width: 25%;
}
}
@media (min-width:992px){
.col {
width: 16.6666667%;
}
}
@media (min-width:1200px){
.col {
width: 8.333333333%;
}
}
正在回答
同学你好，问题解答如下：
响应式布局的原理是将页面分成12份，然后在小屏、中屏、大屏、超大屏下使用定义好的样式类名来控制页面。比如，在小屏下，设置col-sm-1类名，代表让元素宽度占1份，设置col-sm-2类名，代表让元素宽度占两份，即col-sm-1和col-sm-2这两个类名的具体内容是不同的，也就是说这两个类名都要在小屏下提前设置好，因此@media下，会有很多个样式：
祝学习愉快！
相似问题
登录后可查看更多问答，登录/注册
- 参与学习 人
- 提交作业 622 份
- 解答问题 6815 个
微信带火了小程序，也让前端工程师有了更多的展现机会，本阶段带你从移动基础知识的学习到webAPP开发，及小程序开发，让你PC端与移动端两端通吃。
了解课程
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星