bootstrap的使用.

本文详细介绍了Bootstrap框架的栅格系统,包括其响应式布局原理,如何根据屏幕分辨率自动切换样式,以及栅格系统的具体使用方法。栅格系统分为12块,通过不同属性实现多设备适配。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1.bootstrap的栅格系统:

吸取了table和div+css各自的优点 , 进行页面的布局.
是一个响应式页面:
                             设置多套页面的样式(使用同一份代码) , 根据屏幕分辨率自动切换样式.

2.bootstrap的使用:

1.下载bootstrap的框架压缩包 ,                 Bootstrap中文网 http://www.bootcss.com/
在这里插入图片描述
2.将三个文件夹导入项目下.
在这里插入图片描述
3.三大组成部分: (基本都是去这里面复制內容)
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

3.栅格系统布局:
在这里插入图片描述

a.每一个栅格系统分为12块.
b.栅格系统通过属性去进行响应式.
  col-md-*      中等屏幕
  col-sm-*      小型屏幕
  col-xs-*       超小型屏幕
c.div是否显示隐藏
在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值