Bootstrap之排版

(bootstrap3支持的浏览器:Chrome (Mac、Windows、iOS和Android)、Safari (只支持Mac和iOS版,Windows版已经基本死掉了)、Firefox (Mac、Windows)、Internet Explorer、Opera (Mac、Windows))

1、突出显示类

.lead:增大文本字号,加粗文本,而且对行高和margin也做相应的处理

2、强调类

.text-muted:提示,使用浅灰色(#999)
.text-primary:主要,使用蓝色(#428bca)
.text-success:成功,使用浅绿色(#3c763d)
.text-info:通知信息,使用浅蓝色(#31708f)
.text-warning:警告,使用黄色(#8a6d3b)
.text-danger:危险,使用褐色(#a94442)

3、文本对齐类

.text-left:左对齐
.text-center:居中对齐
.text-right:右对齐
.text-justify:两端对齐

4、列表样式类

.list-unstyled:去除默认列表样式,同时将列表默认的左边内距清0(只会清除作为直接子元素的列表项的默认样式)
.list-inline:实现内联列表并去掉项目符号(为制作水平导航而生,只对ul和ol列表起作用)

5、水平定义列表类

.dl-horizontal:给

添加此类名,给定义列表实现水平显示效果

6、代码显示风格标签

使用来显示单行内联代码
使用

来显示多行块代码 

(为了不让其占太大的页面篇幅,可在pre标签上添加类名“.pre-scrollable”,控制代码块区域最大高度,一旦超出就会出现滚动条)
使用来显示用户输入代码(黑色背景)

表格样式类

.table:基础表格
.table-striped:斑马线表格
.table-bordered:带边框的表格
.table-hover:鼠标悬停高亮的表格
.table-condensed:紧凑型表格
.table-responsive:响应式表格

7、表格行元素样式类
在这里插入图片描述

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值