HTMLページにCSSを記述する方法-フロントエンドQ&A-php.cn

CSS (Cascading Style Sheets) は、HTML ページをデザインし、美しくするために使用されるテクノロジーです。 CSS スタイルは、HTML ドキュメント内の タグを通じて、または外部 CSS ファイルから作成および参照できます。

以下は、HTML ページに CSS スタイルを記述する方法の詳細な紹介です。

埋め込み 埋め込みとは、&lt ; を使用して CSS スタイルを HTML ページに直接埋め込むことを指します。 style> タグは CSS コードをラップします。例: 内嵌式CSS样式表 body { background-color: #f0f0f0; font-family: Arial, sans-serif; } h1 { color: #333; text-align: center; } 欢迎来到我的网站 这是一段普通的文字

ログイン後にコピー 上の例では、最初に タグを使用してドキュメントの文字セットを設定し、次に タグを使用します。 ; タグで CSS スタイルを記述します。 タグ内で、ドキュメントの背景色、フォント スタイル、タイトル テキストの色を設定します。

タグは タグ内に配置する必要があり、すべての CSS スタイルは タグ内に配置する必要があることに注意してください。 CSS スタイルを タグ内で直接使用することは無効です。

外部スタイル 外部スタイル シートとは、CSS スタイルを別のファイルに配置し、 タグを通じて HTML ページ内で参照することを意味します。外部スタイル シートには、何度も使用でき、メンテナンスが簡単であるという利点があります。 この場合、CSS スタイルを保存するには、.css 拡張子の付いたファイルを使用する必要があります。ファイルはサーバーまたはローカル コンピュータに配置できます。例:

/* css/style.css */

body { background-color: #f0f0f0; font-family: Arial, sans-serif; }

h1 { color: #333; text-align: center; } ログイン後にコピー HTML ページでは、 タグを使用して、外部 CSS ファイルを HTML ドキュメントに関連付ける必要があります。例:

外部式CSS样式表 欢迎来到我的网站 这是一段普通的文字

ログイン後にコピー 上記のコードでは、 タグを使用して style.css ファイルを HTML ドキュメントに関連付けます。 href 属性は、CSS ファイルの URL または相対パスを指している必要があることに注意してください。 CSS ファイルが HTML ドキュメントと同じディレクトリにある場合、href 属性は CSS ファイル名を直接指すことができます。

インライン スタイル インライン スタイルとは、CSS スタイルを HTML 要素に直接適用することを指します。スタイルシートで定義するのではなく。例: 行内式CSS样式表 欢迎来到我的网站 这是一段普通的文字

ログイン後にコピー インラインでは、HTML 要素の style 属性で CSS スタイルを定義します。各属性はセミコロンで区切る必要があり、属性値は引用符で囲む必要があります。インラインを使用すると、HTML コードが乱雑になり、保守が困難になる可能性があることに注意してください。したがって、実際のプロジェクトでインラインを使用することは一般的に推奨されません。

概要 HTML ページに CSS スタイルを記述する場合、インライン、外部、およびインライン メソッドを使用してそれを実現できます。その中でも、外部スタイルは最も一般的に使用される方法であり、スタイルを 1 つのファイルに集中させてメンテナンスを容易にし、複数回使用することができます。インラインおよびインライン形式の場合は、必要な場合にのみ使用することをお勧めします。そうしないと、HTML コードが乱雑になり、保守が困難になる可能性があります。