CSS(层叠样式表)是一种用于描述HTML或XML文档样式的样式表语言。它允许您将文档内容与文档的呈现方式分离,从而提高网页的可维护性和灵活性。

CSS 基础

选择器

CSS 选择器用于指定要应用样式的 HTML 元素。以下是一些常用的选择器:

  • 元素选择器:例如 p 选择所有 <p> 元素。
  • 类选择器:例如 .my-class 选择所有具有 my-class 类的元素。
  • ID 选择器:例如 #my-id 选择具有 my-id ID 的元素。

属性

CSS 属性用于定义元素的样式。以下是一些常用的属性:

  • 颜色:例如 color: red; 设置文本颜色为红色。
  • 字体:例如 font-family: Arial; 设置字体为 Arial。
  • 背景:例如 background-color: #f0f0f0; 设置背景颜色为灰色。

嵌套

CSS 支持嵌套规则,允许您为子元素设置样式。以下是一个示例:

.container {
  width: 100%;
  background-color: #f9f9f9;
}

.container .item {
  background-color: #e9e9e9;
}

实例

假设您有一个 HTML 文档,其中包含以下内容:

<p class="my-class">这是一个段落。</p>
<div id="my-id">这是一个 div 元素。</div>

您可以使用以下 CSS 为其设置样式:

.my-class {
  color: blue;
}

#my-id {
  font-size: 20px;
}

扩展阅读

如果您想了解更多关于 CSS 的知识,请访问我们的 CSS 教程