「这是我参与11月更文挑战的第25天，活动详情查看：2021最后一次更文挑战」
常用CSS基础样式（一）
该文章是前端入门文章，有经验的大佬可跳过。css全称层叠样式表(英文全称：Cascading Style Sheets)是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。 通常我们使用自定义的css来修饰各种网页元素，包括但不限于设置文本和背景属性；为任何元素创建边框以及元素与元素、元素与边框之间的边距和间距等。
1.样式表的格式
样式表的格式声明可以分为 选择符 和 块 两部分
1.1 基本格式
选择符{属性：值}；
1.2 其他格式
注：通常会存在多个选择符有相同css样式的情况，此时为了简化代码，可以将相同部分合并 及 在多个选择符中添加“，” 分隔。
选择符1，选择符2，选择符3{属性：值}；
2.使用方式
css的使用方式按照其在HTML文档中的位置划分为三种。
2.1 内联样式（行内样式）
行内样式是写在标签内的，作用范围只针对当前所在标签。
例如：
<p style="font-size:20px;color:red;">红色20号字体</p>
2.2 内部样式表（内嵌样式）
内部样式表是将css代码写在头部 标签对 的 标签下。 例如：
<head>
<style type="text/css">
p{
font-size:20px;
color:red;
}
</style>
</head>
2.3 外部样式表（分为链接样式 和 导入样式）
将css样式代码保存在扩展名为.css的样式表中。因其引用方式不同，可分为两种，及 链接式和引用式。
语法如下
2.3.1 链接式
<head>
<style type=“text/css”>
<link type="text/css" rel="styleSheet" href="css文件路径" />
</style>
</head>
2.3.2 链接式导入式
<head>
<style type=“text/css”>
<style type="text/css"> @import url("css文件路径");</style>
</style>
</head>
2.3.3 链接式和导入式的区别
| 链接式 | 导入式 |
|---|---|
| 属于XHTML | 属于CSS2.1 |
| 优先加载CSS文件到页面 | 先加载HTML结构在加载CSS文件 |
3. css中的优先级
理论上 行内样式>内部样式>链接样式>导入样式 实际上，内部、链接、导入 在同一个头部文件时，谁离相应的代码近，谁的优先级就高，简称就近原则。 注：!important 可修改css样式规则的应用优先权。
