一、CSS简述
Cascading Style Sheet 竹节式样表，专门针对用作页面的亮化。
CSS亮化的缺点
机能上更强：比HTML亮化的机能更为强悍，能同时实现HTML无法同时实现的机能减少耦合度：社会分工更为明晰，CSS专门针对用作亮化，HTML专门针对用作内部结构构筑CSS的撰写规范化
四元组：大部份的式样都写在四元组外部。式样名：全数拉丁字母大写，假如数个单字采用 -拆分。式样值：大部份式样名式样值是一般来说的，英文名字和值间采用大括号。式样开头：每一式样采用王劝开头。注解：/* 注解 */ 近似于java中的二百一十三注解。二、CSS边线
2.1 Lembron式样
<div style=“color: red”></div>2.2 外部式样
<style type=“text/css”> p{ color: red; } </style>2.3 外部式样
1. 引入方法一
<link type=“text/css” rel=“stylesheet” href=“css/out.css”/>type：指定文本的类型rel：指定当前的HTML于CSS文件间的关系href：指定式样文件地址2. 引入方法二
<style type=“text/css”> @import url(“css/out.css”) </style>3. 优先级
就近原则，后面的同名式样会覆盖前面的式样
三、基本选择器
用来选择要操作的元素或标签
3.1 语法格式
选择器{ 式样名：式样值; }3.2 三种基本选择器
选择器分类
作用
语法
细节
标签选择器
通过标签名选择同名的大部份的标签
标签名{ }
类选择器
通过标签的class属性的值选择元素
.类名{ }
前提：先给标签进行分类 采用class属性分类、类名：无法以数字开头
ID选择器
通过属性ID选择元素
#ID{ }
前提：先给标签指定ID属性、唯一：ID在同个页面中唯一，不要重复
3.3 优先级
标签选择器 < 类选择器<ID选择器
四、扩展选择器
1. 层级选择器
父选择器 子孙选择器 { } 作用：选择父元素下大部份的子孙元素语法符号：空格2. 属性选择器
– 标签名[属性名] – 标签名[属性名=“属性值”]只要包含属性名就被选中某个属性名=属性值的元素选中语法符号：[ ]中括号3. 伪类选择器
– 链接： – a:link 正常状态 – a:visited 访问过的 – a:hover 鼠标悬停 – a:active 正在激活 – 文本框 – :focus 得到焦点同一个元素在不同的操作状态下呈现不同的式样文本框假如有光标在中间，表示得到焦点语法符号：: 大括号4. 并集选择器
– 格式：选择器1,选择器2 – 作用：数个选择器的集合 – 语法符号：,逗号五、CSS属性
5.1 背景式样
1. 背景色
backgroup-color: ?
颜色常量，如：red采用十六进制，如：#ABC红绿蓝，采用RGP2. 背景图片
backgroup-image: url(图片路径)
3. 平铺方式
background-repeat: ?
repeat：默认，背景图像在垂直和水平方向重复repeat-x：背景图像在水平方向重复repeat-y：背景图像在垂直方向重复no-repeat：背景图像将只显示一次4. 背景边线
background-position: ? ?
单位是像素5.2 文本式样
1. 颜色
color
颜色常量采用十六进制采用rgp2. 设置行高
line-height
单位是像素3. 文字修饰
text-decoration
none：默认，标准的文本underline：下划线overline：上划线4. 文本缩进
text-indent
用作缩进文本，可以采用em单位，表示缩进2个字符，无论字符的大小5. 文本对齐
text-align
left：把文本排列到左边。默认值right：把文本排列到右边center：把文本排列到中间5.3 字体式样
1. 字体名
font-family
2. 设置大小
font-size
单位：像素3. 设置式样
font-style
italic：斜体normal：默认值，标准式样4. 设置粗细
font-weight
bolder：加粗5.4 浮动和清除浮动
1. 浮动：float
left：元素向左浮动right：元素向右浮动2. 清除浮动：clear
left：在左侧不允许浮动元素right：在右侧不允许浮动元素both：在左右两侧不允许浮动元素5.5 display属性
作用：控制元素的显示和隐藏
inline：设置元素为内联元素block：设置元素为块级元素none：设置元素不可见5.6 盒子模型
1. 属性
width：宽度height：高度margin：外边距padding：内边距border：边框的属性2. 边框属性
border-width：边框高度
length：自定义边框的宽度border-style：边框线型
soild：定义实线double：定义双线dotted：定义点状边框dashed：定义虚线border-color：边框颜色
border-radius：边框圆角3. 外边距设置四边值
margin:10px 四边外边距相同margin:10px 20px 上下 左右margin:10px 20px 30px 上 左右 下margin:10px 20px 30px 40px 上 右 下 左(顺时针)4. 每条语句设置一边值
外边距
margin-top:10px 上外边距margin-left:10px 左外边距margin-bottom:10px 下外边距margin-right:10px 右外边距内边距
padding-top:10px 上内边距padding-left:10px 左内边距padding-bottom:10px 下内边距padding-right:10px 右内边距块级元素居中
amrgin：auto;
