1、CSS概述：

CSS（Cascading Style Sheets，层叠样式表）。

层叠：多个样式可以作用在同一个html的元素上，同时生效。

好处：

功能强大；
将内容展示和样式控制分离，降低了耦合度，可以让分工协作更容易；
提高了开发效率。

CSS与html结合的方式有：

内联样式：在标签内使用style属性指定css代码，如 <div style="color: red;">hello css</div>

内部样式：在head标签内使用style标签，style标签的标签体内容就是css代码，如

div{
    color:green;
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
  <style>
    div{
      color: blue;
    }
  </style>
</head>
<body>


<!-- 内部样式：在head标签内使用style标签，style标签的标签体内容就是css代码 -->
<div>hello css</div>

</body>
</html>

外部样式：① 定义css资源文件；② 在head标签内，定义link标签，引入外部的资源文件。如：

div{
    color:green;
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
  <link rel="stylesheet" href="css/a.css">
<!--也可以用如下形式：-->
<!--  <style>-->
<!--    @import "css/a.css";-->
<!--  </style>-->
</head>
<body>

<!-- 外部样式：
  1、定义css资源文件；
  2、在head标签内，定义link标签，引入外部的资源文件。
 -->
<div>hello css</div>

</body>
</html>

注意：三种方式的css作用范围越来越大；第1种方式不常用，后期常用第2，3种方式。

2、CSS基本语法

格式：

选择器 {
    属性名1:属性值1;
    属性名2:属性值2;
    ...
}

选择器：筛选具有相似特征的元素。

注意事项：每一对属性需要使用 ; 隔开，最后一对属性可以不加。

JavaWeb基础学习笔记6——CSS

1、CSS概述：

2、CSS基本语法

3、选择器

3.1、基本选择器

3.1.1、id选择器：

3.1.2、元素选择器：

3.1.3、类选择器：

3.2、扩展选择器

4、属性