Google Chromeの開発機能でCSSの修正が超楽になった!

Google Chromeの開発機能でCSSの修正が超楽になった!

いままでなんとなく僕は、なんとなくCSSをいじってたんだよね。

Chromeの開発機能でhtmlに直接CSSを書いたりしてた。

Chromeの開発機能でCSSの修正が簡単に

でも、今回のアップデートでクラスをつけるのがほんとうに簡単になった!

具体的には

・クラスを簡単につけれるようになった。

・またそのクラスについてCSSを簡単にかけるようになった。

スクリーンショット 2016-03-25 11.57.54

例えばこんなふうになっていたものを

スクリーンショット 2016-03-25 11.58.07

いつもお馴染みのこの画面から

スクリーンショット 2016-03-25 11.58.25

.clsというところを押すとクラスをつけることが出来る。

さらに指定した箇所に+ボタンを押せばそのクラスについてCSSを簡単にかけるようになった。

スクリーンショット 2016-03-25 11.59.58

はいなおったー!

 

何が違うのか?

いままで直書きで書いていたCSSをクラスを使って簡単に管理&修正できるようになった!

これでやっとソースが綺麗に書けそうですwwww

おさらい

これだけ覚えておいて欲しいのは
.cls

+
ボタンを使えばかなり楽にCSSがかけるようになりました。

attrip

attrip

考えたことを、記事・AI・音楽に変えて発信しています。

盆栽、音楽、ブログ運営、日々の試行錯誤について書いています。

2010年から発信中