選択した要素の CSS プロパティのリストを表示するには、[CSS] パネルを開いて、[計算済み] タブに切り替えます。要素が 1 つだけ選択されている場合にのみ、算出スタイルを表示できます。
ルールごとに 1 つのプロパティが設定されている場合、プロパティ名の横に矢印が表示されます。プロパティをクリックすると、ルールと、ルールで指定されている値が表示されます。
- 複数のルールが同じプロパティに影響を及ぼす場合、最も優先度の高いルールが表示されます。
- プロパティを変更する場合は、ルールセレクタ名をクリックして [スタイル] タブに切り替え、このルールに直接ジャンプして、編集できます。[計算済み] タブで CSS を編集することはできません。
フィルタリング
CSS パネルに表示されるプロパティのリストはフィルタリングできます。
既定のフィルタ
プルダウンから既定のフィルタを選択できます。
- すべて - すべてのプロパティ(デフォルト値に設定されたプロパティを含む)を表示します。
- 概要 - 一致ルールで明示的に定義されているプロパティを表示します(これがデフォルトのビューです)。
- フォント - フォント関連のプロパティを表示します。
- 背景 - 背景関連のプロパティを表示します。
カスタム フィルタ
独自のフィルタを適用するには、虫メガネアイコン をクリックして、[フィルタ プロパティ] にプロパティ名の一部を入力します。カスタム フィルタはアクティブな既定のフィルタとともに動作するため、[すべて] を選択して、カスタム フィルタをすべてのプロパティに適用する必要があります。