Chromeの新機能：CSSの概要

Chromeはクールな実験的な新機能を起動します！これで、色の数から未使用のクレームの数、さらには定義されたメディアクエリの総数まで、ウェブサイトの使用のCSS概要をすばやく表示できます。

これは実験的な機能であることに注意する必要があります。これは、それがまだ開発中であり、DevToolsで使用する前に有効にする必要があることを意味します。

• devtoolsを開く（Mac上のコマンドオプションを押す; Windowsでの制御シフトI）
• devtoolsの設定に移動します（press？or function f1 on mac;またはwindowsのf1）
• [実験]セクションをクリックして開きます
• CSSの概要オプションを有効にします

次に、DevToolsメニューバーに新しい「CSS概要」タブが表示されます（設定が閉じた後）。表示されていない場合は、オーバーフローメニューに隠されていないことを確認してください。

レポートは、色、フォント情報、未使用のステートメント、メディアクエリなど、いくつかの部分に分かれていることに注意してください。この情報は非常に包括的で明確です。

この機能は非常に実用的です！この種のツールがブラウザに統合し始める傾向が大好きです。考えてみてください。これは、フロントエンドの開発者に役立つだけでなく、デザイナーとのコラボレーションを促進します。たとえば、デザイナーはそれを開いて、私たちの作業をチェックして、パレットからフォントスタックまですべてが無傷であることを確認できます。

以上がChromeの新機能：CSSの概要の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。