bootstrap用法
使用bootstrap的准备工作
a)引入meta标签,为了移动端
b)引入jq
c)引入bootstrap的css和js文件
除了栅格系统的css部分
1、当引入文件后会给页面默认加东西
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 14px;
line-height: 1.42857143;
color: #333;
2、标题
重写了h1到h6
还提供了h1-h6的class名
小标题
还提供了small类
3、内联文本元素 *
高亮也加了mark的类
被删除的文本
带下划线的文本,
小号文本父级字体大小的85%
着重
斜体
对齐:text-left|right|center|justify|nowrap
文本对齐方式两端对齐不换行
文本大小写
转小写text-lowercase
转大写text-uppercase
首字母大写text-capitalize
基本缩略语attr结合title使用
首字母缩略语HTML结合title使用
地址
4、列表
清除列表样式 list-unstyled
让li变成行内快list-inline
5、表格***
a)去掉了一些默认样式,边距
b)table里面加.table 会加上下边,会自适应
c)在table里面加table-bordered 四周都有边框
d)table-striped条纹状表格
e)table-hover鼠标悬停
f)table-condensed紧凑型
g).active 是给tr加的鼠标悬停的转台灰色
.success标识成功或积极的动作绿色
.info标识普通的提示信息或动作蓝色
.warning标识警告或需要用户注意橙色
.danger危险红色
6、表单
文本元素 加form-control让点击的时候有阴影
7、按钮**
最好用这两个、当然也可以用input
如果想用必须先加上 .btn
a的话务必加上role="button"
默认按钮btn-default
首选项btn-primary
成功btn-success
提示信息btn-info
警告btn-warning
危险btn-danger
链接btn-link
大号.btn-lg
小号.btn-sm
超小号.btn-xs
8、图片 **
给图片加class img-responsive 图片会自适应
img-rounded圆角
img-circle圆形
img-thumbnail边框
9、辅助类***
a、情境文本颜色给文字变色
b、caret 小三角
c、close ×默认在右上角
d、快速浮动:pull-left pull-right
【bootstrap用法】清除浮动clearfix
推荐阅读
- 由浅入深理解AOP
- 【译】20个更有效地使用谷歌搜索的技巧
- mybatisplus如何在xml的连表查询中使用queryWrapper
- MybatisPlus|MybatisPlus LambdaQueryWrapper使用int默认值的坑及解决
- MybatisPlus使用queryWrapper如何实现复杂查询
- iOS中的Block
- Linux下面如何查看tomcat已经使用多少线程
- 使用composer自动加载类文件
- android|android studio中ndk的使用
- 使用协程爬取网页,计算网页数据大小