bootstrap进一步学习

颜色——背景色和前景色(文字颜色)
在这里插入图片描述
下图是对比颜色
在这里插入图片描述
在这里插入图片描述
设置盒子的高 和宽
在这里插入图片描述

内边距和外边距在bootstrap里面的应用
在这里插入图片描述
在这里插入图片描述
设置值为0,可以设置为零边距

按钮的各种设定
在这里插入图片描述
在这里插入图片描述

布局网格系统,bootstrap自动把页面宽度分为12个宽,我们设置列宽,只需要指定是12分之几宽就可以了
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
响应式布局(自己根据浏览设备的不同,显示不同的样式)
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

下图是响应式布局的写法
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
表格的使用
在这里插入图片描述
在这里插入图片描述

Tab的使用
在这里插入图片描述
上图是基本结构

下面实现tab效果
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
当鼠标经过一段词时候,先显示提示框,这种效果的实现
在这里插入图片描述在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
导航条的汉堡效果,就是当用手机查看网页时,导航栏的项目栏会消失,变成三条横线,当点击时候,消失的项目栏会出现!

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/steve1988717/article/details/87864212