30DAYSトライアル VScode お勉強 ツール

【デイトラ】Google Chromeの検証と編集【30DAYSトライアル DAY10】

30DAYSトライアル

Google Chromeはデフォルトブラウザとして使用しているのでダウンロードの工程はすっ飛ばし。

Chrome検証でh1の文字を変更するのはできたけど、文字色を変えるのができない!!!

Chrome検証でCSS編集

h1の文字サイズは元々CSSで定義しているからこんな風にクリックして

中の数値を変更することができたけど。

文字色ってどこで変更するの?
そもそも文字色なんて定義してない

元のファイルで一回定義して?...いやいやそんなバカな。
Chrome検証で編集するのが今回の課題なんだから。

と思いつつ、CSSの空欄部分をクリックしてみたら、

あ、なんかいけそう!

しかも候補まで出てくる!すごい!!

 

無事に文字色を変えることができました!

完成!!

【VScode】LiveServerの使い方

LiveServerがめちゃくちゃ便利!
インストールするだけじゃ機能しないので、VScode右下にあるこの『Go Live』をクリックして機能をONしましょう!

追加でやること

ProgateのjQueryとFlexboxもやる!
デイトラアプリがリリースされて、余力があればやりましょう!とあったので。

-30DAYSトライアル, VScode, お勉強, ツール
-, ,

© 2021 文系女子とプログラミング