どうも！NISO desu!皆さんのおかけで、今日ものんびり、プログラミング記事を書いてます。そして今日はいよいよCSS編に突入しますね。皆さんウェブサイトのデザインを修正するとき、いつもF5を押してて、大変だと思わないですか？そんなあなたに、このDEVELOPER TOOLSを紹介します！特にインストールは必要ないので、早速使い方説明しますね。
必要なもの：
世界を受け入れる愛が溢れる心、綺麗な目つき、コーヒー（人によって紅茶になるかもしれません）、パソコン、Google Chrome
従来の流れ
VS Codeで修正→サイト開いて、F5して確認→VS Codeに戻って修正してループする
Developer toolsがあれば
VS Code → サイト開いて F5→（Developer Tools で修正する（ここでループ））
一見そんなに変わらないけど、何か強いかというと、developer toolsで修正した変数はすぐに反映しますので、何度も、VS CODEに戻って、F5を押す必要がなくなります。
そして、何より、変なズレも確認できます。“えっ なんでそうなっちゃうの？”と思ったら、こちらの機能でmarginとpadding簡単に確認できるので、非常にわかりやすいです。
緑がpaddingで オレンジがmarginです
あとスマホ版とタブレット版を作るときに、画面の横縦がパソコンと違うため、パソコンでなかなかうまく調整できないが、こちらの機能を使えば、サイズに設定して、スマホ版、タブレット版のプレビューが可能になります。
それ以外に、特定なコマントを入れて、プログラミングの部分のバグも確認できますので、非常に役に立ちます。（色んなやり方がありますので、ここはちょっと割愛させます。）
こちらでのdeveloper toolsがあれば、ウェブサイトを作成するのは結構楽になりますので、愛が溢れる心と綺麗な目付つとdeveloper toolsでウェブサイト作りましょう！それでは！w