bootstrapのprintモジュールの変更点

更新

追加された行はこの色です。
削除された行はこの色です。
プログラミング/css/bootstrapのprintモジュールへ行く。
プログラミング/css/bootstrapのprintモジュールの差分を削除

[[公開メモ]]

* いろいろ迷惑 [#k6ab07a7]

.visible-print や .hidden-print は良いとして、
「a 要素の直後にリンク先を括弧書きで印刷する」なんて機能は迷惑千万。

ユーザーは基本的には WISIWIG を期待するのだし、
背景の印刷をする・しないはブラウザ側で選べることが多いし、、、ぶつぶつ

 LANG:css(linenumber)
 @media print {
   *, :after, :before {
     color: #000 !important;
     text-shadow: none !important;
     background: 0 0 !important;
     -webkit-box-shadow: none !important;
     box-shadow: none !important
   }
 
   a, a: visited {
     text-decoration: underline
   }
 
   a[href]:after {
     content: " (" attr(href) ")"
   }
 
   abbr[title]:after {
     content: " (" attr(title) ")"
   }
 
   a[href^="javascript:"]:after,
   a[href^="#"]:after {
     content: ""
   }
 
   blockquote, pre {
     border: 1px solid #999;
     page-break-inside: avoid
   }
 
   thead {
     display: table-header-group
   }
 
   img, tr {
     page-break-inside: avoid
   }
 
   img {
     max-width: 100% !important
   }
 
   h2, h3, p {
     orphans:3; /* 改ページされる際の前ページの最低行数 */
     widows:3   /* これは何？ */
   }
 
   h2, h3 {
     page-break-after: avoid
   }
 
   select {
     background: #fff !important
   }
 
   .navbar {
     display: none
   }
 
   .btn > .caret,
   .dropup > .btn > .caret {
     border-top-color: #000 !important
   }
 
   .label {
     border: 1px solid #000
   }
 
   .table {
     border-collapse: collapse !important
   }
 
   .table td,
   .table th {
     background-color: #fff !important
   }
 
   .table-bordered td,
   .table-bordered th {
     border: 1px solid #ddd !important
   }
 }

やっていることは、
- 装飾を極力削る
-- 背景をできる限り白にする
-- 文字を黒にする
-- ドロップシャドーを無効にする
- リンクの後に括弧書きで飛び先を表示する
- リンクに下線を表示する
- 短縮語の後に括弧書きで正式名を表示する
- blockquote, pre に枠を付ける
- 改行関連
- navbar を隠す
- .btn > .caret に枠を付ける
- テーブルに枠を付ける

ですが、
- 改行関連（これは有効）
- navbar を隠す（これは有益）
- .btn > .caret に枠を付ける（これは有効？）

以外は余計なので、

 LANG:css(linenumber)
 @media print {
   thead {
     display: table-header-group
   }
 
   img, svg, tr {
     page-break-inside: avoid
   }
 
   img {
     max-width: 100% !important
   }
 
   h2, h3, h4, p {
     orphans:3; /* 改ページされる際の前ページの最低行数 */
     widows:3   /* これは何？ */
   }
 
   h2, h3, h4 {
     page-break-after: avoid
   }
 
   .navbar {
     display: none
   }
 }

としました。

Counter: 7095 (from 2010/06/03), today: 2, yesterday: 7