CSSファイルの基本
今回はエディタを用いて、CSSファイルの保存方法と完成したCSSファイルをブラウザで表示する方法を紹介します。
※手順の画像はMacBookProを用いております。また、エディタはVisual Studio Codeを使用しております。
Visual Studio CodeのダウンロードはこちらCSSファイルの保存と表示の手順
①ダウンロードしたVisual Studio Codeを開き、画面左上の新しいファイルをクリック
②新しいファイルが開き、保存コマンドを押すと下記表示が出るので、拡張子をcssにして保存。今回は、style.cssという名前でデスクトップに保存
③保存後、ファイル内に表示用のコードを記載する。今回は<h1>タグにcolorプロパティをredと記載
HTMLファイルにてCSSを読み込む方法については次の記事内にて紹介します。
エンジニアからのアドバイス
今回は、エディタを開きそこからファイルを作成しましたが、作成済みのファイルでも拡張子がcssとなっており、表示できる内容が記載されていれば表示されます。今回は手順は一例として使いやすいエディタや手順を自分なりに試してみましょう。