Help us understand the problem. What is going on with this article?

DevToolsでCSSをBeautifyできるようになった

More than 5 years have passed since last update.

※canaryで確認。stableはまだできなかった (2013/10/09)

JSの再整形は前からあったけど,ついに圧縮されて1行になったCSSを再整形して表示できるようになった。

圧縮されたcssをelementsパネルで追うと~.css:1といった表示になってて

01.png

クリックしてCSSを追うと

02b.png

1行になってて見づらい。ここで{}をクリック!

03.png

beautiful!!

elementsパネルの行数もちゃんと整形後の部分をさすように。

04.png

今までもオンラインツールとかextensionでBeautifyできたけど,DevToolsでできるようになってかなりお手軽に。

nakajmg
フロントの人。JavaScript/CSS/HTML
http://nakajmg.github.io/
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away