CSS (Cascading Style Sheets) は、Web ページのレイアウトと表示効果を記述するために使用される言語で、HTML ページ内の要素のスタイル、フォント、色、サイズ、位置などを制御できます。この記事ではCSSの基本的な使い方と実装方法を紹介します。

1. CSS の基本的な使い方

CSS は通常、HTML ファイルまたは外部 CSS ファイルに含まれています。 CSS スタイルは、次の 2 つの方法で定義できます。

1. 内部スタイル シート: HTML style> タグの タグ内に CSS コードを直接記述します。例:

  
    
    
  

  
    
这是一个标题
    
这是一个段落。
  

ログイン後にコピー

body 要素の背景色は水色、h1 に設定されています。要素は白で中央に配置されます。

外部スタイル シート: CSS スタイルを別の .css ファイルで定義し、
2. タグを使用して HTML ファイルに導入します。例:

  
    
    
  

  
    
这是一个标题
    
这是一个段落。
  

ログイン後にコピー

styles.css ファイルにすべての CSS スタイル定義が含まれています。

テキスト関連のスタイル

font-size 属性を使用して、フォント サイズを変更します。フォント サイズ (例:

p {
  font-size: 18px;
}

color 属性を使用します。例:

p {
  color: red;
}

font-style 属性を使用してフォント スタイルを変更します。例:

p {
  font-style: italic;
}

ボックス モデル関連のスタイル

width 属性と height 属性を使用して、要素の幅と高さを変更します。例:

div {
  width: 200px;
  height: 100px;
}

position と left、right、# を使用します。 ##top、bottom 属性を使用して要素の位置を変更します。例:

div {
  position: absolute;
  left: 100px;
  top: 50px;
}

属性は次のように設定されています。 absolute を選択し、left 属性と top 属性を使用して、div 要素をページの中央に配置します。

3. 要素の背景スタイルを変更することで、Web ページをより美しくすることができます。

(1) 背景色の変更

属性を使用して要素の背景色を変更します。例:

body {
  background-color: lightblue;
}

属性を使用して背景画像を設定します。例:

body {
  background-image: url("bg-image.jpg");
}

以上がCSSの基本的な使い方と実装方法についてお話しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。