第二部 @media print
pre, blockquote { /* 块引用 */ border: 1px solid #999; page-break-inside: avoid; }
215行是个空格,是什么个意思?闲着蛋疼往前翻了翻,3.0.X版本没这个问题。根本没这行。
设置边框宽度为1px,实心,颜色#999,并且避免在内容里挺入分页符。
page-break-inside据说只有opera支持,可用的值有3个
auto,默认值。有需要的时候就插入分页符。
avoid,避免在元素内部插入分页符。
inherit,继承。
thead { display: table-header-group; }
设置表头thead的显示方式为表格标题组的样式。
tr, img { page-break-inside: avoid; }
设置表格行,图片内不插入分页符。
img { max-width: 100% !important; }
图片的最大宽度为100%,最高优先级。
p, h2, h3 { orphans: 3; widows: 3; } h2, h3 { page-break-after: avoid; }
设置行标签、标题2、3的内容如果出生了分页的情况,则在页面底部orphans最少保留3行,在头部windows最少保留3行。但标题2、3内是尽量避免挺入分页符滴。
select { background: #fff !important; }
列表的背景是白色,最高优先级。
.navbar { display: none; }
设置使用.navbar样式的元素不显示。
这里用到了类选择器,也就是.开头的这种。
.table td, .table th { background-color: #fff !important; }
设置.table样式的(表格头、表格体的)单元格的背景颜色为白色,优先于其它的设定。
这里用到了上下文选择器,像这里的,应用了“.table样式里面的td元素”。
.btn > .caret, .dropup > .btn > .caret { border-top-color: #000 !important; }
这里用到了新的选择器,子选择器。
应用.btn样式标签里面,应用了.caret样式的标签的 上表框的颜色为黑色。
第二行更复杂一点,3层。 应用了.dropup里,应用了 .btn的子标签里,应用了 .caret的子标签。
.label { border: 1px solid #000; }
应用.label样式的标签的边框为 宽度1px 实心 黑色。
.table { border-collapse: collapse !important; }
应用.table样式的标签的相邻单元格的边框合并显示。
.table-bordered th, .table-bordered td { border: 1px solid #ddd !important; }
应用了.table-bordered样式的标签的单元格为,边框宽度1px 实心 颜色 #ddd
待续。