语法讲解
CSS的三种导入方式
行内导入
<h1 style="color: red">实验文字</h1>
内部导入
<head>
<style>
h1{
color: yellow;
}
</style>
</head>
<body>
<h1>实验文字</h1>
</body>
外部导入
css文件
h1{
color: green;
}
htnl文件
<head>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<h1>实验文字</h1>
</body>
三种基础选择器
标签选择器
上文外部导入就是一种标签选择器，标签选择器会作用在所有标签上
类选择器
css文件
.lei{
color: blue;
}
html文件
<h1 class="lei">实验文字</h1>
类选择器的核心是类，类可以复用在任何标签上，但不一定有效。
id选择器
css
#ID{
color: orange;
}
html
<h1 id="ID">实验文字</h1>
原则上id是唯一的。id重复会报错，但可以编译运行。
※：id重复会干扰JS获取id。
CSS特性
摘要
覆盖原则：
在元素冲突时，后面的元素会覆盖前面的元素。
因为link通常写在前面，所以经常体现为：
行内导入>内部导入>外部导入
选择器优先级：
更精确的选择器会覆盖更粗糙的选择器，即
id选择器>类选择器>元素选择器
选择器优先级在覆盖原则之上
特例：
行内导入没有使用选择器，所以优先级最高；
!important是提权的元素，所以优先级更高。
详解
标签介绍
< link>标签
<link rel="stylesheet" href="" hreflang="">
rel：当前文件与被链接文件的关系
href：被链接文件的位置的位置
hreflang：规定网站语言