css - Chrome Inspector で新しい CSS プロパティを追加できますか?

Question

Chrome インスペクタに新しい CSS プロパティを追加することはできますか? 既存のプロパティしか編集できないようです。

また、プロパティを編集したら、改訂された CSS を全体として表示する方法はありますか?

score 18 · Accepted Answer

はい、Chrome インスペクタに新しい CSS プロパティを追加して、いくつかの簡単な手順で確認できます。

Chrome インスペクターに新しい CSS プロパティを追加する

score 7 · Accepted Answer

ルール内でダブルクリックすると、ルールに新しいプロパティを追加できます。また、隅にあるホイールから新しいルールを追加し、[新しいスタイルルール] を選択することもできます。

改訂されたドキュメント全体を表示するには、次の場所にアクセスしてください。Resources > Frame > site name > Stylesheets > stylesheet-name.css

または単に css プロパティの上にある + 記号をクリックします。

score 4 · Accepted Answer

Chromeインスペクターに新しいCSSプロパティを追加することは可能ですか？既存のプロパティしか編集できないようです...

[スタイル]パネルの空白の空白部分をダブルクリックするだけです。

}編集したいCSSルールの右側をダブルクリックする傾向があります。

また、プロパティを編集したら、改訂されたCSS全体を表示する方法はありますか？

@Sotirisの回答を参照してください。

~~私が知っていることではありません。~~

~~これを実行できる拡張機能があるかもしれませんが、拡張機能が存在する場合は、元のCSSの正確なフォーマットが保持されない可能性があります。~~

score 2 · Accepted Answer

なぜだめですか？StylesこれがGoogleChromeインスペクターのパネルのスクリーンショットです

ブロックに注意してください：

element.style {

}

その領域をマウスでクリックするだけで、インスペクターが新しいスタイルを追加する機会を与えてくれます。要素に新しい属性を追加する必要がある場合は、Elementsパネルでその要素を右クリックして、[属性の追加]を選択します。

また、プロパティを編集したら、改訂されたCSS全体を表示する方法はありますか？

Computed Styleパネルはあなたにこの情報を与えませんか？そこで、ノードに適用されているすべてのスタイルを確認できます。実際には、どのルールで、どのスタイルシートから適用されているかを確認できます。

4 に答える 4