文档章节

Bootstrap 3.2.0 源码试读 2014/08/11

go_array
 go_array
发布于 2014/08/11 21:14
字数 594
阅读 133
收藏 6

第二部 @media print

212至217行

  pre,
  blockquote {    /* 块引用 */
    border: 1px solid #999;

    page-break-inside: avoid;
  }

215行是个空格,是什么个意思?闲着蛋疼往前翻了翻,3.0.X版本没这个问题。根本没这行。

设置边框宽度为1px,实心,颜色#999,并且避免在内容里挺入分页符。

page-break-inside据说只有opera支持,可用的值有3个

auto,默认值。有需要的时候就插入分页符。

avoid,避免在元素内部插入分页符。

inherit,继承。


218至220行

  thead {
    display: table-header-group;
  }

设置表头thead的显示方式为表格标题组的样式。


221至224行

  tr,
  img {
    page-break-inside: avoid;
  }

设置表格行,图片内不插入分页符。


225至227行

  img {
    max-width: 100% !important;
  }

图片的最大宽度为100%,最高优先级。


228至237行

  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3;
  }
  h2,
  h3 {
    page-break-after: avoid;
  }

设置行标签、标题2、3的内容如果出生了分页的情况,则在页面底部orphans最少保留3行,在头部windows最少保留3行。但标题2、3内是尽量避免挺入分页符滴。


238至240行

  select {
    background: #fff !important;
  }

列表的背景是白色,最高优先级。


241至243行

  .navbar {
    display: none;
  }

设置使用.navbar样式的元素不显示。

这里用到了类选择器,也就是.开头的这种。


244至247行

  .table td,
  .table th {
    background-color: #fff !important;
  }

设置.table样式的(表格头、表格体的)单元格的背景颜色为白色,优先于其它的设定。

这里用到了上下文选择器,像这里的,应用了“.table样式里面的td元素”。

248至251行

  .btn > .caret,
  .dropup > .btn > .caret {
    border-top-color: #000 !important;
  }

这里用到了新的选择器,子选择器。

应用.btn样式标签里面,应用了.caret样式的标签的 上表框的颜色为黑色。

第二行更复杂一点,3层。 应用了.dropup里,应用了 .btn的子标签里,应用了 .caret的子标签。

252至254行

  .label {
    border: 1px solid #000;
  }

应用.label样式的标签的边框为 宽度1px 实心 黑色。


255至257行

  .table {
    border-collapse: collapse !important;
  }

应用.table样式的标签的相邻单元格的边框合并显示。


258至261行

  .table-bordered th,
  .table-bordered td {
    border: 1px solid #ddd !important;
  }

应用了.table-bordered样式的标签的单元格为,边框宽度1px 实心 颜色 #ddd


待续。

© 著作权归作者所有

go_array

go_array

粉丝 4
博文 34
码字总数 29198
作品 0
沈阳
部门经理
私信 提问
Bootstrap 3.2.0 源码试读 2014/08/04

第一部分 normalize.css 用于解决不同浏览器下显示不一致的问题 8至12行 html { font-family: sans-serif; / 设置默认字体为 sans-serif / -webkit-text-size-adjust: 100%; / 手机等设备转屏...

潘金莲子羹
2014/08/04
0
0
Bootstrap 3.2.0 源码试读 2014/08/09

第一部分 normalize.css 104至110行 code, / 编辑代码 /kbd, / 键盘输入的文本 /pre,samp { / 范例,sample的简写 / font-family: monospace, monospace; / 这个地方应该是写错了,第二字体应...

潘金莲子羹
2014/08/09
0
0
Bootstrap 3.2.0 源码试读 2014/08/10

第一部分 normalize.css 167至171行 fieldset { padding: .35em .625em .75em; margin: 0 2px; border: 1px solid #c0c0c0;}legend { padding: 0; border: 0;} 表单分组标题的内添充为上 .2......

潘金莲子羹
2014/08/10
0
1
Bootstrap 3.2.0 源码试读 2014/08/07

第一部分 normalize.css 70至72行 small { font-size: 80%;} 设置small标签的字体大小为父容器字体的80%。 73至79行 sub,sup { position: relative; font-size: 75%; line-height: 0; vertic......

潘金莲子羹
2014/08/07
0
0
CSS组件库--BootFlat

Boot Flat 基于Bootstrap3.2.0的FLAT UI的CSS组件库,提供了比原生bootstrap更加丰富的页面元素组件和页面布局,适合快速地进行Web app的开发。 兼容浏览器IE8,IE9, IE10, IE11, FIREFOX,C...

raydian_yuan
2013/09/11
9.4K
0

没有更多内容

加载失败,请刷新页面

加载更多

Python爬虫也能用手机进行抓包?没错!这个技巧我只告诉你

今天要说说怎么在我们的手机抓包 我们知道了 HTTP 的请求方式 以及在 Chrome 中摸清了一些套路 但是 除了对数据进行解析之外 有时候我们想 对请求的数据或者响应的数据进行篡改 怎么做呢? ...

计算机编程
24分钟前
2
0
趣图:听说996工作可以获得巨大成长

听说996工作可以获得巨大成长 。 。 。 这成长也忒快了吧 扩展阅读 趣图:菜鸟程序员的工作状态… 趣图:当计算机可以更新的时候 趣图:什么?需求文档又改了

Java面经
28分钟前
3
0
influxdb 学习

InfluxDB 学习 安装 brew install influxdb 启动 influxd -config /usr/local/etc/influxdb.conf 入门 $ influx -precision rfc3339Connected to http://localhost:8086 version 1.2.xI......

solate
34分钟前
3
0
快速掌握mongoDB(三)——mongoDB的索引详解

  1 mongoDB索引的管理      2 mongoDB中常用的索引类型      1 单键索引      2 复合索引      3 多键索引      4 哈希索引      3 mongoDB中常用的索引属性   ...

SEOwhywhy
35分钟前
1
0
JackJson中自定义JsonSerializer的使用

最近在做一个需求,一个时间字段,数据库类型为timestamp,默认值为'1970-01-01 08:00:01',产品要求这种情况展示为“-1”,实体类中的属性类型为Date,我也不能把Date属性值设置为“-1”,又...

Coder顾
36分钟前
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部