Sofia Emelianova
要素に CSS を適用したのに機能しなかったことはありますか？
Chrome DevTools を使用すると、CSS の問題を一目で把握し、デバッグやテストを行うことができます。
[要素] > [スタイル] ペインで、CSS に関するさまざまな問題がどのようにハイライト表示されるかの動画をご覧ください。
無効な構文のプロパティ
オーバーライドされたプロパティ
無効なプロパティ 
parentから継承しました
継承されるプロパティ
非継承プロパティ
展開可能な省略形プロパティ 
上書きされたロングハンド プロパティ
アクティブなロングハンド プロパティ
ユーザー エージェント スタイルシート
- 編集不可のプロパティ
上書きされた編集不可のプロパティ
その他のデバッグのヒント:
- [スタイル] ペインのフィルタを使用して、関心のあるプロパティに絞り込むことができます。
- [計算済み] ペインを使用して、カスケードのすべての落札者とその算出値を確認できます。
- [計算済み] ペインでプロパティを展開し、リンクをクリックして [スタイル] ペインでソースを確認します。
DevTools で CSS の問題がハイライト表示されるすべての方法について詳しくは、無効な CSS、オーバーライドされた CSS、無効な CSS を見つけるをご覧ください。
CSS の専門知識をレベルアップするには、CSS について学習するをご覧ください。
すべてのユーザーに適した見栄えの良いウェブサイトを作成する方法については、レスポンシブ デザインの詳細をご覧ください。