ホームページ  >  記事  >  ウェブフロントエンド  >  DIV に設定されている CSS スタイルを確認する方法

DIV に設定されている CSS スタイルを確認する方法

藏色散人
藏色散人オリジナル
2021-01-04 09:23:371879ブラウズ

DIV によって設定された CSS スタイルを表示する方法: 1. ショートカット キーの組み合わせ [Ctrl Shift C] を押し、表示されている要素にマウスを移動して表示します; 2. 検査されている要素をクリックします。 3、[チェック]を右クリックします。

DIV に設定されている CSS スタイルを確認する方法

#このチュートリアルの動作環境: Dell G3 コンピューター、Windows7 システム、Chrome76.0&&CSS3 バージョン。

推奨: 「

css ビデオ チュートリアル

DIV に設定されている CSS スタイルを確認してください

フロント ページに渡された CSS スタイルが表示され、フロントエンド開発者はツールを使用して Web ページ上の CSS を表示またはデバッグできます。

Google Chrome または Firefox の使用をお勧めします。これら 2 つのブラウザには強力なコンソールがあり、フロントエンド開発者にとって必要なデバッグ ツールの 1 つです。

以下は Google Chrome を例にしています (Firefox も同様です):

1. ショートカット キーの組み合わせ Ctrl Shift C

DIV に設定されている CSS スタイルを確認する方法

を押します。上の図に示すように、現在のページで Ctrl Shift C のキーの組み合わせを押し、表示されている要素にマウスを移動すると、要素がレビュー可能な状態に設定されます。

2. レビュー中の要素をクリックします

DIV に設定されている CSS スタイルを確認する方法

上に示すように、現在の要素の CSS スタイルがコンソールの右側にリストされます。

右側の CSS プロパティを編集することで、ページの表示スタイルをデバッグでき、非常に便利です。

より高速な方法:

DIV に設定されている CSS スタイルを確認する方法

次の手順は上記と同じです。

以上がDIV に設定されている CSS スタイルを確認する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。