CSS的概念（随堂记录）

1.CSS指层叠样式表 cascading syle sheets
2.作用：定义如何显示HTML的元素
3.语法结构：
选择器：{属性：值；属性：值}；
4.使用方式：（从上而下运行，具有覆盖性）
4.1.内嵌样式

<h1 style="属性名：值"></h1>

4.2.内部样式

<style type="text/css">
        a{
            text-decoration: none;
            color:black;
        }
        a:hover{
            color:red;
        }
    </style>

4.3.外部样式（先创建.css文件）

<link src="css/a.css">

5.CSS选择器
5.1.基本选择器
5.1.1.标签（元素）选择器 元素名{属性名：值}
5.1.2.类选择器 .类名{属性名：值}
5.1.3.id选择器 #id名{属性名：值}
5.2.复合选择器
5.2.1.并列关系 p,li：p标签和li标签所有都应用
5.2.2.包含关系 p li：p标签里面的li标签应用
5.2.3.父级关系 p>li：所有li标签父级是p标签应用
5.2.4.结构上的并列 p+li：紧跟p标签后面的li标签应用
5.2.5.[属性] [ ]：中的属性名应用
6.常用的文本和字体样式
6.1字体
font-family（字体类型）font-style（字体倾斜）font-weight（字体粗细）
6.2文本
color（颜色） text-align（对齐方式）：center / right / left
text-decoration（文本修饰）：underline / overline / line-through
line-height（行高）+ height（高度）垂直水平居中
7.列表的样式
list-style：none ---->去掉小圆点
list-style-image：url("…")；----->替换type图片
list-style-position：outside/inside；---->标记放置的位置
8.背景样式
background-colors：…; ----->背景的颜色
background-image：url("…"); ----->背景中插入图片
background-repeat：
repeat；----->x和y轴都重复平铺
repeat-x；----->只有x轴平铺
repeat-y；----->只有y轴平铺
no-repeat；----->不平铺
background-position：0px 2px ----->x轴的移动，y轴的移动
9.超链接的样式
a:link(color:red) ----->未点击时为红色
a:hover(color:red) ----->鼠标悬停在上面时为红色
a:visted(color:yellow) ----->访问过的超链接颜色
a:active(color:blue) ----->点击时的颜色
10.行级元素和块级元素
行级元素（与其它元素在一行显示）：strong,b,em,i,a,img,video,audio,input,iframe,span
块级元素（独占一行）：p，h，li，dt，dd，table，div
11.盒子模型
padding：内填充
border：边框
margin：外边距（margin的左右值是累加、margin的上下值是取最值）
以上四个的赋值顺序为top，right，bottom，left