7

よりきれいな形式でクロムでcssを表示するにはどうすればよいですか。現在、私が見ているのは次のようなものです：

input_tiny{幅:50px}.input_small{幅:100px}.input_medium{幅:150px}.input_large{幅:200px}.input_xlarge{幅:250px}.input_xxlarge{幅:300px}.input_full{幅:100%}. input_full_wrap{display:block;padding-right:8px}::-moz-focus-inner{border:0;padding:0}input{margin:0}input[type="search"]::-webkit-sear

それらは 1 行で表示されます。どうすれば複数行にすることができますか

.input_tiny{
    width:50px
 }
 .input_samll{
     width:100px
 }
 ......
4

3 に答える 3

12

Chromium チケットが修正済みに更新されました https://code.google.com/p/chromium/issues/detail?id=163123

これは現在、Chrome の安定版で利用できます。CSS をきれいにするには、中かっこで囲まれたボタンをクリックする必要があります (JS と同じ方法)。

クロム開発ツール

于 2013-10-02T16:41:05.113 に答える
5

コード ビューティファイアにコピー アンド ペーストできます。お気に入りはありませんが、いくつかは次のとおりです。

http://www.codebeautifier.com/

http://procssor.com/

css ビューティファイアー/プリティファイアーについては Google のみ。

参考までに...Javascriptにも同様のツールを使用できます。

于 2013-05-24T23:52:50.397 に答える
4

そこで、知っておくべきことが 2 つあります。クロムインスペクターを開くことができます

Windows では Ctrl + Shift + J、Mac では ⌥ + ⌘ + J。次に、左下の小さな虫眼鏡をクリックします。ページの要素にカーソルを合わせてクリックできるようになりました。右側に適用されるすべての css が表示され、変更を加えて新しいルールを追加することもできます。

もう 1 つ知っておくべきことは、ほとんどのページで css が 1 行で提供される理由です。サイトと共に提供される CSS に多くの空白が含まれている場合、転送する情報が多くなり、ページの読み込みに時間がかかります。つまり、誰もがあなたが見たようにミニフィケーションと呼ばれるものを実行します。

すべての css だけが必要な場合は、どのファイルがリンクされているかを確認することもできます。ページに応じて、CSS は HTML と一緒にタグに配置されるか、ファイルに配置されます。ソースコードを見て、それらへのリンクを見つけることで (または chrome 開発者ツールを介して) css ファイルをダウンロードできます。

それ以外のMTAdminの答えは、cssをきれいにするためだけに欲しいものかもしれません。

于 2013-05-25T00:02:38.980 に答える