CSS(Cascading Style Sheets) 级联样式表 主要用于美化样式
1.样式表
1.1、内部样式表
内嵌式：集中在head头部标签中，用style标签定义，一般位于title标签之后
1.2、行内样式表
内联样式：<标签名 style="属性；">内容</标签名>
1.3、外部样式表
链入式：将所有样式放在一个或多个以.CSS为扩展名的外部样式表文件中，通过
link标签将外部样式表文件链接到HTML文档中
<head>
<link href="CSS文件路径" rel="stylesheet"/>
</head>
注：link是个单标签，rel：定义当前文档与被链接文档之间的关系，
指定为"stylesheet"，表示被链接文档是一个样式表文件
type：定义所链接文档的类型，指定为“text/CSS”，表示
外部文件为CSS样式表。
三种样式表的优缺点：
样式表 优点 缺点 使用情况 控制范围
行内样式表 书写方便，权重高 没有实现样式和结构相分离 较少 控制一个标签（少）
内部样式表 部分结构和样式相分离 没有彻底分离 较多 控制一个页面（中）
外部样式表 完全实现结构和样式相分离 需要引入 最多，强烈推荐 控制整个站点（多）
多个类用空格隔开
2.CSS字体属性
2.1、font-size ：字号大小
px：像素（最常用）
em：相对于当前对象内文本的字体尺寸（首行缩进）
2.2、font-family：字体
eg：p{ font-family:"微软雅黑";}
常用技巧，见文档
2.3、font-weight：字体粗细
normal、bold、bolder、lighter、100~900（100的整数倍）。
2.4、font-style：字体风格
normal：默认值，浏览器会显示标准的字体样式。
italic：浏览器会显示斜体的字体样式。
font综合设置字体样式
选择器{font: font-style font-weight font-size/line-height font-family;}
注：顺序不能更换，不需要设置的可以省略，但必须保留size和family属性
3.CSS外观属性
3.1、color：文本颜色
四种形式~
背景颜色：background-color
3.2、line-height：行间距
像素px，相对值em，百分比%
text-align：水平对齐方式
left：左对齐（默认值）
right：右对齐
center：居中对齐
3.3、text-indent:xem 首行缩进
建议使用em作为设置单位
3.4、text-decoration
文本装饰效果
none 默认。定义标准的文本。
underline 定义文本下的一条线。下划线 也是我们链接自带的
overline 定义文本上的一条线。
line-through 定义穿过文本下的一条线。
4.基础选择器
4.1、标签选择器（元素选择器）
标签名/元素名{属性1：属性值~}
特点：能快速为页面中同类型的标签统一样式，但不能设计差异化样式
4.2、类选择器
用 . + 类名 进行标识，调用时用 class=类名 即可
特点：可以定义单独样式，可以选择一个或多个标签
4.3、多类名选择器
class中 多个类用空格隔开 顺序无关，跟style中的顺序有关
4.4、id选择器
使用“ # ”标识，后面紧跟id名
#id名{属性1：属性值~}
id值是唯一的
4.5、通配符选择器
“ * ”，作用范围最杠，能匹配所有元素
注：越精确的优先级越高，所以通配符 * 优先级最低
5.复合选择器
5.1、交集选择器 （注：交集选择器优先级高于并集选择器）
标签选择器.类别选择器{……}
5.2、并集选择器
.类别选择器，标记选择器{……}
5.3、后代选择器
外层标签 内层标签{……} 嵌套关系
5.4、子代选择器
外层标签 > 内层标签{……} 注意，只包含儿子，不包含孙子之类，符号左右两侧各保留一个空格。
6.伪类选择器
eg：.类名：link{}
6.1、链接伪类选择器
:link /* 未访问的链接 */
:hover /* 鼠标移动到链接上 */
:active /* 选定的链接 */
:visited /* 已访问的链接 */
注：按照lhav的循序，不能乱
7.标签显示模式
HTML标签一般分为块标签、行内标签与行内块标签三种类型
7.1、块状元素
每个块元素通常都会独自占据一整行或多整行，可以对其
设置宽度、高度、对齐等属性，常用于网页布局和网页结构的搭建。
常见的块元素有h1-h6/p/div/ul/li/ol/dl/dd/dt/table/tr/td/
caption/form等，其中<div>标签是最典型的块元素。
特点：
1、有默认的宽高，宽是父元素的100%，高度是内容所撑起来的高度
2、宽高可以设置
3、独占一行
4、可以容纳任意的元素（h/p元素不能容纳块状元素）
5、可以设置外边距和内边距的。
7.2行内元素
仅仅靠自身的字体大小和图像尺寸来支撑结构，一般不可以设置
宽度、高度、对齐等属性，常用于控制页面中文本的样式。
常见的行内元素有<a>、<strong>、<b>、<em>、<i>、<del>、<s>、
<ins>、<u>、<span>等，其中<span>标签最典型的行内元素。
特点：
1、有默认的宽高，宽高是内容所撑起来的
2、宽高设置是无用的
3、相邻的行内元素或者行内块元素在同一行上显示
4、只可以容纳行内元素与内容
5、水平方向上的外边距和内边距可以设置，垂直方向设置无用
注：1. 只有文字才能组成段落，因此p里面不能放块级元素，同理还有这些标签h1,h2,h3,dt，
他们都是文字类块级标签，里面不能放其他块级元素
2.链接里面不能再放链接
3.a里面可以放块级元素
7.3、行内块元素
特点：
1、有默认的宽高，是元素本身的宽高
2、宽高是可以设置的
3、相邻的行内元素或者行内块元素在同一行上显示
4、一般不容纳其他元素
5、外边距和内边距都是可以设置的
7.4、标签显示模式转换
块转行内：display:inline;
行内转块：display:block;
块、行内元素转换为行内块： display: inline-block;
8.CSS背景(background)
background-color 背景颜色
background-image：none | url 背景图片地址
background-repeat：repeat | no-repeat | repeat-x | repeat-y 是否平铺
background-position：x轴 y轴 背景位置 百分数/像素/: top|center| bottom |left|right
background-attachment：scroll | fixed 背景固定 scroll 还是滚动 fixed
background:背景颜色 背景图片地址 背景平铺 背景滚动 背景位置 背景的合写（复合属性）
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
