印刷可能なCSSのデバッグ方法は?
2023-08-16 11:30:06
質問
私は Firebug と IE Developer Toolbar をいつも使って、CSS のやっかいな問題をデバッグしています。 しかし、時折、ページを印刷しようとしたときにだけ表示される厄介なバグが発生します。
このような問題を診断するために、どのようなテクニック/ツールを使っていますか? 印刷表示で従来の CSS デバッグ ツールをもっと活用する方法はありますか?
更新しました。私の問題は、印刷された DOM を右クリックすることができないことです。 以下の他の回答のいくつかは非常に役に立ちました、ありがとうございます。:-)
どのように解決するのですか?
Chrome 51の場合。
devtools を開く (
CTRL + F12
または
CTRL + SHIFT + I
) をクリックし
...
メニューをクリックし
More Tools > Rendering settings
をクリックすると
Rendering
タブを開きます (コンソールが開いている場合は、このタブに移動するだけでもかまいません)。
そのタブで、以下のボックスを選択し、チェックします。
Emulate Media: print
.
関連
-
[CSSチュートリアル]css display table adaptive height, widthの問題解決
-
[CSSチュートリアル]CSSは、メソッドのさまざまな記事の分割行のスタイルの要約を達成するために
-
[css3]ピュアCSS3によるネオンライト効果
-
[CSSチュートリアル]テーブル table :nth-child()を使って行間の色変更と整列を実現する。
-
[css3]CSS3遷移回転遠近法2D3Dアニメーションなどの効果を持つサンプルコード
-
[解決済み] 要素を水平方向にセンタリングする方法
-
[解決済み] CSSの親セレクタはありますか?
-
[解決済み] CSSでcellpaddingとcellspacingを設定する?
-
[解決済み] CSSでテキストや画像の背景を透明にするには?
-
[解決済み】HTML5入力のプレースホルダの色をCSSで変更する。
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[CSSチュートリアル]CSSで簡単!高周波な異形ボタンを実現する方法
-
[CSSチュートリアル】overflow:hiddenの役割を解説(overflow hidden、clear float、外周マージンの崩れを解決する)。
-
[CSSチュートリアル】CSSのクラスとidの共通命名規則
-
[CSSチュートリアル】背景-位置の割合の原則の説明
-
[css3]css3はtransform-originを使用して、大きな円上のドット分布のレイアウトと回転を実現します。
-
[CSSチュートリアル】タイトルを上部に配置するスティッキーレイアウトを実現するためのCSS
-
[CSSチュートリアル】空間均等性の問題を解決する2つの方法
-
[CSSチュートリアル】CSSでマウスの位置をマッピングし、マウスの動きでページ要素を制御する効果を実現する(コード例)
-
[CSSチュートリアル】シンプルなナビゲーションバー機能を実現するhtml+css
-
[解決済み] Chromeの要素インスペクタを印刷プレビューモードで使用する?