使用css样式表
1. 内联样式：<h1 style=””></h1>
2. 内部样式表：<head><style></style></head>
3. 外部样式表：<link rel=”stylesheet” type=”text/css” href=”样式表url”/>
4. 还可以在一个外部样式表中通过@import引入另一个样式表 @import “header.css”
css样式表特征
1. 继承性
2. 层叠性
3. 优先级：内联样式（最高） 外部样式表或内部样式表（就近原则） 浏览器缺省设置（最低）
!important：手动调整样式属性的优先级
选择器
1. 通用选择器
*{}
2. 元素选择器
元素{}
3. 类选择器
.类名{}
4. id选择器
#id名{}
5. 伪类选择器
链接伪类
:link，尚未访问的链接
:visited，访问过后的链接
动态伪类
:hover，鼠标悬停在元素时
:active，元素被激活时
:focus，元素获取焦点时
颜色单位
1. rgb
rgb(0-255,0-255,0-255)
rgb(x%,x%,x%)
rgba(x,x,x,0-1)
2. 十六进制
通过六位十六进制的数字表示颜色
溢出
overflow
visible：溢出可见
hidden：溢出隐藏
scroll：设置滚动条
auto：自动
overflow-x：横向溢出处理方式
overflow-y：纵向溢出处理方式
设置滚动条样式
设置滚动条的宽度：scrollbar
设置滚动条轨道的样式：scrollbar-track
设置滚动条滚动部分：scrollbar-thumb
边框
border:宽度 样式 颜色
边框圆角
border-radius
边框阴影
box-shadow:水平阴影距离 垂直阴影距离 模糊距离 阴影的尺寸 颜色
图片边框
border-image:图片路径 宽度 平铺方式（repeat/round/stretch）
盒模型
元素实际宽度=边框+内边距+宽度
在IE浏览器下，外边距包含在元素实际宽度中
背景
1. 背景颜色
background-color
2. 背景图片
background-image
3. 背景重复
background-repeat
repeat：垂直和水平都平铺
repeat-x：水平方向平铺
repeat-y：垂直方向平铺
no-repeat：不平铺
4. 背景尺寸
background-size
value1 value2：宽度 高度
value1% value2%：百分比
cover：完全覆盖 碰到最后一个边缘停止
contain：碰到第一个边缘停止
网友评论