排版-标题及table
排版-标题
在标题中还可以包含small标签，可以用来标记副标题
副标题灰色，比主标题小
<h1>我是标题 <small>我是小标题</small></h1>
页面主体
Bootstrap 将全局 font-size 设置为 14px，line-height 设置为 1.428。这些属性直接赋予 <body> 元素和所有段落元 素。另外，<p> （段落）元素还被设置了等于 1/2 行高（即 10px）的底部外边距（margin）。
无用文本
对于没用的文本使用 <s> 标签。
带下划线的文本
为文本添加下划线，使用u标签
着重
通过使用strong强调一段文本
文本对齐
<p class="text-left">Left aligned text.</p>
<p class="text-center">Center aligned text.</p>
<p class="text-right">Right aligned text.</p>
<ul class="list-inline">
<li>...</li>
</ul>
表格
基本实例
为任意 <table> 标签添加 .table 类可以为其赋予基本的样式 — 少量的内补（padding）和水平方向的分隔线。这种方式看起来很多余！？但是我们觉得，表格元素使用的很广泛，如果我们为其赋予默认样式可能会影响例如日历和日期选择之类的插件，所以我们选择将此样式独立出来。
//不带条纹的
<table class="table">
...
</table> //条纹table
<table class="table">
...
</table>
<div class="container">
<div class="row">
<div class="col md-12">
<table class="table table-striped">
<tr class="text-center">
<th class="text-center">标题</th>
<th class="text-center">备注</th>
<th class="text-center">名称</th>
</tr>
<tr class="text-center">
<td>Ｃ＃</td>
<td>怎么学好Ｃ＃</td>
<td>长春师范</td>
</tr>
<tr class="text-center">
<td>前端开发</td>
<td>怎么学好前端</td>
<td>河北师范</td>
</tr>
</table>
</div> </div>
</div>
效果
带表框的table
添加 .table-bordered 类为表格和其中的每个单元格增加边框。
<table class="table table-bordered">
...
</table>
鼠标悬停
通过添加 .table-hover 类可以让 <tbody> 中的每一行对鼠标悬停状态作出响应。
<table class="table table-hover">
...
</table>
排版-标题及table的更多相关文章
- BootStrap入门教程 (二) ：BASE CSS（排版(Typography),表格(Table),表单(Forms),按钮(Buttons)）
上讲回顾:Bootstrap的手脚架(Scaffolding)提供了固定(fixed)和流式(fluid)两种布局,它同时建立了一个宽达940px和12列的格网系统. 基于手脚架(Scaffoldin ...
- WPS 文字排版 标题回车后标题号自动增加
飞思卡来互联网提供全球性的 看了看 风格的呵呵 合格否d合格否的 secure embedded嵌入式解 个国家和地区,注册了成千上万项专利,产品面向 物联网,汽车电子,消费电子,工业及网络设备等市 ...
- Bootstrap3 排版-标题
HTML 中的所有标题标签,<h1> 到 <h6> 均可使用.另外,还提供了 .h1 到 .h6 类,为的是给内联(inline)属性的文本赋予标题的样式. h1. Boots ...
- 关于table元素的认识
表格是网页上最常见的元素,但是,现在对很多刚入行的前端们那是谈table色变.那是为啥?这是表格的框架的简单.明了.在传统的网页中使用没有边框的表格来排版是非常流行.在web标准逐渐深入设计领域以后, ...
- bootstrap基础学习小记（二）排版、列表、代码风格、表格
排版——标题.副标题.段落(正文文本).强调内容.粗体.斜体.强调相关的类.文本对齐 <!DOCTYPE HTML> <html> <head> <meta ...
- table详解
1.tr 元素定义表格行,th 元素定义表头,td 元素定义表格单元. tr内是th还是td可由自己定义,th,td可存在于任一行,th与td的区别在与th字体更粗 2.定义一个table默认有bor ...
- Bootstrap方法之--排版、代码
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8& ...
- Selenium之table操作
操作内容: 获取table总行数.总列数.获取某单元格的text值,删除一行[如果每行后边提供删除的按钮] HTML代码: <html><head><meta http- ...
- 善用 CSS 中的 table-layout 屬性加快 Table 的顯示速度
在很久以前我們都是用 Table 在排版的,我相信現在還是有不少人還是在用 Table 進行排版而非現在較為流行的 CSS 排版,使用 Table 排版最大的好處就是版面在各瀏覽器中顯示比較不會亂掉. ...
随机推荐
- href=#与href=javascript:void(0)的区别
#"包含了一个位置信息,默认的锚点是#top 也就是网页的上端 而javascript:void(0) 仅仅表示一个死链接 这就是为什么有的时候页面很长浏览链接明明是#可是跳动到了页首,而 ...
- bug的一些事
Bug级别:(由高到低) 1.critical:系统直接崩溃,瘫痪.无法正常打开使用产品 2.Block:逻辑出现严重问题,流程卡住,无法进行下一步 3.Major:部分功能出现闪退,功能没有实现,但 ...
- 2017-2018-1 20155205 嵌入式C语言——时钟
2017-2018-1 20155205 嵌入式C语言--时钟 题目要求 基础知识 插入位(以分钟为例) 提取位(以分钟为例) 在提取分钟时,运用到了位运算,位运算有以下规律: &0 --&g ...
- 【python-HTMLTestRunner】生成HTMLTestRunner报告报错ERROR 'ascii' codec can't decode byte 0xe5 in position 0: ordinal not in range(128)
[python-HTMLTestRunner]生成HTMLTestRunner报告报错:ERROR 'ascii' codec can't decode byte 0xe5 in position 0 ...
- noip第15课资料
- HTTPS抓包之Charles
这里对HTTP请求的抓包操作不做讲解了,只讲解HTTPS的抓包要进行的操作. [说明]:下面以MAC电脑示例,Windows版本可参考:http://weibo.com/ttarticle/p/sho ...
- Thinking in Java Chapter 14
From Thinking in Java 4th Edition RTTI(Run-Time Type Information),运行时类型信息,使得你可以在程序运行时发现和使用类型信息.对RTTI ...
- 字符串拼接时使用StringBuffer还是StringBuilder？
StringBuffer.StringBuilder和String一样,也用来代表字符串.String类是不可变类,任何对String的改变都 会引发新的String对象的生成:StringBuffe ...
- 关于height、offsetheight、clientheight、scrollheight、innerheight、outerheight的区别一览
平时,不管在pc端页面还是移动端页面,因为我们一般很少会设置某个块的的高度,但是呢,我有时候有需要取到这些高度以便于我们方便进行判断和下一步的编写.一般这个时候我都是直接的获取一个块的高度.heigh ...
- springmvc的异步处理
关于异步的好处我在这里就不多说了,自从servlet3.1规范发布以来,控制层的异步处理也越来越多的被人提及.而Spring5的webflux诞生也意味着Spring全方位对异步提供了支持. ...