-
HTMLファイルの作成: Visual Studio Codeを開き、新しいファイルを作成します。ファイルを保存する場所と名前を選択し、".html"の拡張子で保存します。
-
CSSファイルの作成: 同じディレクトリに新しいファイルを作成し、".css"の拡張子で保存します。このファイルには、ウェブページのスタイルを定義するCSSコードを記述します。
-
CSSファイルをHTMLにリンクする: HTMLファイルを開き、以下のコードを
要素内に追加します。<link rel="stylesheet" type="text/css" href="styles.css">
上記のコードでは、href属性の値をCSSファイルの名前に設定しています。もしCSSファイルが別のディレクトリにある場合は、正しいパスを指定する必要があります。
-
プレビュー: リンクが正しく設定されたら、HTMLファイルをプレビューモードで開いて、CSSが適用されていることを確認します。Visual Studio Codeのプレビューモードは、右上の「ブラウズ」ボタンをクリックするか、キーボードショートカット「Ctrl + Shift + V」を使用してアクセスできます。
以上がVisual Studio CodeでHTMLにCSSをリンクする方法です。これにより、CSSファイルに定義されたスタイルがHTMLページに適用され、ウェブページの外観をカスタマイズすることができます。