bootstrap思考一

时间:2023-03-08 15:52:12

bootstrap是一种热门的Web前端流行框架,如果要兼容PC端、手机端和响应式布局,那他一定是我的首选。bootstrap内容很多,功能强大,其中最好入门也是很重要的就是他的栅格系统。他有四个典型类:

col-xs-     对应超小设备(屏幕<768 px )手机

col-sm-    对应小型设备(屏幕>768 px 屏幕<992 px )平板电脑

col-md-   对应中型设备(屏幕>992 px 屏幕<1200 px )台式电脑

col-lg-    对应大型设备(屏幕>1200 px)台式电脑

简单的写法:

<div class="row">
    <div class="col-xs-3 col-sm-2 col-md-2"></div>
    <div class="col-xs-3 col-sm-2 col-md-2"></div>
   <div class="col-xs-3 col-sm-2 col-md-2"></div>
</div>