CSS 语法和选择器

CSS（层叠样式表）是一种用于描述网页样式和布局的标记语言。它使用选择器来选择HTML元素，并通过属性和值来设置元素的样式。

语法

CSS的语法由选择器和声明块组成。声明块由大括号{}包围，里面包含一个或多个属性和对应的值。每个属性和值用冒号:分隔，多个声明之间用分号;分隔。

以下是一个简单的CSS语法示例：

选择器 {
  属性: 值;
  属性: 值;
  /* 更多属性和值 */
}

选择器

选择器用于选择HTML元素，然后应用相应的样式。常见的选择器包括：

• 标签选择器：选择特定类型的HTML元素。例如，p选择所有<p>标签元素。
• 类选择器：选择具有相同类名的HTML元素。例如，.red选择所有具有class="red"的元素。
• ID选择器：选择具有特定ID的HTML元素。例如，#logo选择具有id="logo"的元素。
• 属性选择器：选择具有特定属性的HTML元素。例如，[name="email"]选择所有具有name="email"属性的元素。
• 后代选择器：选择某个元素的后代元素。例如，div p选择所有位于<div>标签内部的<p>标签元素。

还有许多其他类型的选择器，用于更精确地选择HTML元素。

示例

下面是一个CSS示例，展示了如何使用语法和选择器来设置网页中的样式：

/* 标签选择器 */
h1 {
  color: blue;
  font-size: 24px;
}

/* 类选择器 */
.red {
  color: red;
}

/* ID选择器 */
#logo {
  width: 200px;
  height: 100px;
}

/* 后代选择器 */
.container p {
  text-align: center;
}

以上示例中，h1选择器选择所有的<h1>元素，设置它们的颜色为蓝色，字体大小为24像素。.red选择器选择所有具有class="red"的元素，将它们的颜色设置为红色。#logo选择器选择具有id="logo"的元素，设置其宽度为200像素，高度为100像素。.container p选择器选择所有位于class="container"的元素内部的<p>元素，将其文本居中。

以上就是CSS语法和选择器的介绍。通过使用合适的选择器和属性，您可以轻松地控制HTML元素的样式和布局。使用CSS，您可以创建漂亮且可定制的网页。