ホームページ > ウェブフロントエンド > CSSチュートリアル > CSS ファイルを HTML ファイルに適切にリンクするにはどうすればよいですか?

CSS ファイルを HTML ファイルに適切にリンクするにはどうすればよいですか?

Mary-Kate Olsen
リリース: 2024-12-02 01:48:09
オリジナル
678 人が閲覧しました

How to Properly Link a CSS File to an HTML File?

HTML ファイルから CSS ファイルをリンクする方法

HTML ファイルから CSS ファイルをリンクするときに問題が発生します。この問題は、次のことを確認することで解決できます:

正しい属性値を設定する

HTML ファイルでは、rel 属性の値を「これが機能することを願っています。」ではなく「stylesheet」に設定する必要があります。 」修正されたコードは次のようになります。

<link rel="stylesheet" href="newcssstyle.css" type="text/css">
ログイン後にコピー

ファイルの配置を確認する

「newcssstyle.css」ファイルは、参照する HTML ファイルと同じディレクトリに存在する必要があります。サブフォルダー内にある場合は、それに応じて href 属性のパスを調整します。

ディレクトリ構造と相対ファイル パスの例

ケース 1: CSS ファイルは、という名前のサブフォルダーにあります。 "Stylesheets."

Parent Directory Name
   index.html
   Stylesheets
      newcssstyle.css
ログイン後にコピー

HTML:

<link rel="stylesheet" href="Stylesheets/newcssstyle.css">
ログイン後にコピー

ケース 2: CSS ファイルは、という名前の別のサブフォルダーにあります。 "Html_files."

Parent Directory Name
   Html_files
      index.html
   Stylesheets
      newcssstyle.css
ログイン後にコピー

HTML:

<link rel="stylesheet" href="../Stylesheets/newcssstyle.css">
ログイン後にコピー

ケース 3: CSS ファイルは HTML と同じディレクトリにありますファイル。

Parent Directory Name
   index.html
   newcssstyle.css
ログイン後にコピー

HTML:

<link rel="stylesheet" href="./newcssstyle.css">
ログイン後にコピー

以上がCSS ファイルを HTML ファイルに適切にリンクするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート