![見出し画像](https://assets.st-note.com/production/uploads/images/8097078/rectangle_large_type_2_2f07958fa61f0b5d41077735bf351265.jpg?width=1200)
学習日誌もさらりと書けるようになってきた
継続は力なり。学習日誌も6記事目に突入しました。CSS入門の第2回にいってみよー!今回はいったん小休止のような内容で、CSSがブラウザでどう解釈されるか確認する方法を習いました。
#02 デベロッパーツールを使ってみよう
Chromeでは確認のためのツールが用意されていて、それをデベロッパーツールと呼ぶそうです。下がデベロッパーツールを開いた状態で、画面下半分がツールになっています。
今後よく使うツールとのことで、ここでもショートカットキーをひとつ覚えました。デベロッパーツールはcommand+option+i キーで開きました。
今回は基本事項としてCSSの調べたい要素があったときの、ツール内での探し方を学習。
上はツールの右側を拡大した画面ですが、こちらはCSSで設定したスタイルを確認できるところです。Stylesタブ、Computedタブ内に表示されている内容についてもさらっと教わりました。
今日もこれにてさらりと終了!視聴時間は2分37秒でした。