CSS基础——导入方式及选择器

一、什么是CSS?

CSS是一门语言，用于控制网页表现，CSS(Cascading Style Sheet):层叠样式表

W3C标准：网页主要由三部分组成

结构:HTML 表现:CSS 行为:JavaScript

二、CSS 导入方式

CSS导入HTML有三种方式：

1、内联样式： 在标签内部使用style属性，属性值是css属性键值对，也就是通过style属性标签指定CSS代码，来控制div标签的样式。html代码与css代码耦合在一起，不利于复用（不常用）

<div style="color: pink"> Hello CSS</div>

2、内部样式： 定义< style>标签，在标签内部定义css样式。（较常用）

<style type="text/css">
    div{
            
     
        color: pink;
    }
</style>

3、外部样式： 定义link标签，引入外部的css文件（常用） link标签可以引入很多类型的外部资源，需要用rel指明引入的是什么类型的文件，否则不生效。

<link rel="stylesheet" href="demo.css">

demo.css: div{ color: pink; }

三、CSS选择器

1、概念：选择器是选取需设置样式的元素（标签）

2、分类：

（1）元素选择器 格式：元素名称{color: red;} 例如：p{color: red}

（2）id选择器 格式：#id属性值{color: red;} 例如：<div id="name">hello css </div> #name{color : red;} 注意：id值唯一，不同标签的id不能相同。

（3）类选择器 格式：.class属性值{color: red} 例如：.cls{color :red;} <div class="cls">hello css </div> 注意：在不同标签里，class的值可相同

哪个选择范围越小，就执行哪个

四、CSS属性

（更多属性可参考w3school.com.cn)