Asp.netバンドルの印刷ページでブートストラップスタイルを使用する方法

Question

印刷プレビューに行/列グリッドを使用しようとしていますが、印刷プレビューに行と列がすべてありません。私はthisソリューションを参照し、正しく私のhtmlに示すリンクタグを持っていました：

そして、これは印刷プレビューで示しています：

<link href="/Content/bootstrap.css" rel="stylesheet" type="text/css" media="all"> 

はまだ、これは画面上に表示さ

印刷プレビューに表示するブートストラップスタイルを取得する方法a印刷されたページ？

Answer 1

thisによれば、ブートストラップ3は紙のページが768px未満であると見なし、ページのモバイル版を表示します。おそらく、印刷されたビュー用の特別な印刷スタイルシートを作成するべきです。

代わりに、あなたはこのように、あなたのグリッドにXSクラスを追加することでこれを回避することができるはず：

<div class="row"> 
    <div class="col-lg-4 col-md-4 col-xs-4"> 
     <h1>First Name</h1> 
    </div> 
    <div class="col-lg-4 col-md-4 col-xs-4"> 
     <h1>Middle Initial</h1> 
    </div> 
    <div class="col-lg-4 col-md-4 col-xs-4"> 
     <h1>Last Name</h1> 
    </div> 
</div> 
<div class="row"> 
    <!-- Next row --> 
</div> 

印刷ビューが小さいと異なっているので、これは、しかし素晴らしいアイデアではありませんビューポートなので、別の印刷スタイルシートを作成することをお勧めします。