引入css的语法格式

外部样式表

外部样式表是将CSS样式保存在外部的.css文件中，然后通过HTML文档的部分使用标签引入。这种方法使得CSS可以被多个页面共享，便于维护和更新。外部样式表的语法格式如下：

这里，stylesheet.css是外部CSS文件的名称，它应该位于与HTML文档相同的目录中，或者其路径应正确指向该CSS文件的位置。

CSS选择器

CSS选择器用于选择页面上的元素以应用样式规则。以下是一些常用的CSS选择器：

• 元素选择器：通过元素名称选择元素。

  p {
    font-size: 16px;
  }
  

• 类选择器：通过元素的class属性选择元素。

  .highlight {
    background-color: yellow;
  }
  

• ID选择器：通过元素的id属性选择元素，ID在页面上应该是唯一的。

  #header {
    font-size: 20px;
  }
  

• 属性选择器：根据元素的属性及其值来选择元素。

  input[type="text"] {
    width: 200px;
  }
  

CSS规则和声明

CSS规则由选择器和声明块组成。声明块包括一个或多个声明，每个声明由一个属性、一个冒号和值组成。

selector {
  property: value;
  property2: value2;
  /* 更多的声明 */
}

继承

CSS中的继承意味着子元素会继承父元素的某些样式属性。并非所有属性都可以被继承，例如background-color可以继承，而border则不可以。

层叠

当多个样式规则应用于同一个元素时，CSS的层叠机制将决定哪个规则生效。层叠顺序通常由选择器的特异性（重要性）和样式的来源（内联、内部、外部）决定。

媒体查询

媒体查询允许你根据不同的媒体类型和特性来应用不同的CSS样式，这在响应式设计中非常有用。

@media screen and (max-width: 600px) {
  body {
    background-color: lightblue;
  }
}

结论

CSS是网页设计中不可或缺的一部分，它提供了强大的功能来控制网页的外观和布局。通过内联样式、内部样式表和外部样式表，开发者可以灵活地选择适合项目需求的样式应用方式。掌握CSS的选择器、规则、继承和层叠等概念，可以帮助开发者创建出既美观又具有良好用户体验的网页。