CSS 语法

CSS 语法由 3 部分组成:选择器 selector、属性property和值value

selector {
  property: value;
}

选择器是我们想要设置样式的 HTML 元素。

这可以是任何标签,例如 <h1>、<p> 等。

每个选择器可以有一个或者多个属性。

该属性是 HTML 标记的样式属性。
所有 HTML 属性都转换为 CSS 属性(颜色、边框等)。

每个属性都有它的价值。

该值被分配给属性。
例如,颜色属性的值可以是红色或者#F1F1F1.

CSS 语法示例:

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      a {
        color: #1c87c9;
      }
    </style>
  </head>
  <body>
    <a>The color of this link is #1c87c9.</a>
  </body>
</html>

在上面的例子中 <a> 标签是一个选择器,颜色是属性,#1c87c9 是属性的值。

如我们所见,属性及其值写在大括号内并用冒号分隔。

选择器也可以有多个属性,用分号分隔。

CSS 注释

我们可以使用 CSS 注释为代码添加解释。
它们不会显示,因为浏览器会忽略它们。

CSS 注释的开头和结尾分别由“/”和“/”指定:

/*This is some comment*/

如我们所见,我们在“/”和“/”中写入了我们的文本,它们不会在浏览器上显示。
因此,当我们不想在 CSS 中显示任何信息时,请将其写在“/”和“/”之间。

CSS 注释示例:

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      h1 {
        padding-left: 10px;
        font-size: 26px;
        line-height: 30px;
        /*color:red;*/
      }
      p {
        color: #1c87c9;
        /*font-size:25px;
        border:1px solid red;
        */
        padding: 10px;
        line-height: 30px;
      }
    </style>
  </head>
  <body>
    <h1>CSS Comments</h1>
    <p>
      生活本就是矛盾的,白天与黑夜间的距离,春夏秋冬之间的轮回,于是有了挑剔的喜爱,让无奈加上了喜悦的等待。
是谁把光阴剪成了烟花,一瞬间,看尽繁华。是谁把思念翻起了浪花,一转身,浪迹天涯。

    </p>
  </body>
</html>
日期:2020-06-02 22:14:27 来源:oir作者:oir