CSS(层叠样式表)的语法相对简单,主要包括选择器、属性和值。以下是基本的 CSS 语法结构:

1. 选择器(Selectors):

选择器用于选择要样式化的 HTML 元素。常见的选择器有:

  •  元素选择器: 通过元素的名称选择元素。

  p {
      /* 样式规则 */
  }

  •  类选择器: 通过元素的类名选择元素。

  .highlight {
      /* 样式规则 */
  }

  •  ID 选择器: 通过元素的 ID 选择元素。

  #header {
      /* 样式规则 */
  }

  •  属性选择器: 通过元素的属性选择元素。

  input[type="text"] {
      /* 样式规则 */
  }

2. 声明块(Declaration Block):

声明块包含一个或多个声明,每个声明定义了一个样式属性和其对应的值。声明块由花括号 {} 包围。
/* 声明块开始 */
p {
    color: blue;
    font-size: 16px;
}
/* 声明块结束 */

3. 声明(Declaration):

声明由属性和值组成,用冒号 : 分隔。每个声明以分号 ; 结尾。
p {
    /* 属性: 值 */
    color: blue;
    font-size: 16px;
}

4. 注释:

CSS 中的注释以 /* 开始,以 */ 结束。
/* 这是一个注释 */
p {
    color: red; /* 这也是一个注释 */
}

5. 多个选择器和声明:

可以将多个选择器和声明组合在一起。
/* 多个选择器 */
h1, h2, h3 {
    font-family: 'Arial', sans-serif;
}

/* 多个声明 */
p {
    color: green;
    margin: 10px;
}

以上是 CSS 的基本语法结构。深入学习时,你会遇到更多高级的 CSS 特性和语法,如伪类、伪元素、媒体查询、过渡、动画等。CSS 的语法简洁而灵活,通过实践和掌握常用选择器和属性,你将能够更好地样式化和布局网页。


转载请注明出处:http://www.zyzy.cn/article/detail/12518/CSS