块标签
h div p ul li ol dl dt dd
独占一行
支持宽高
不受换行和空格的影响
不给宽度时 宽度参照父级
行内
a span i em strong b
合并到一行
不支持宽高
受换行和空格的影响
宽高由内容撑开
行内块
img input
合并到一行
支持宽高
受换行和空格的影响
css样式
width 宽
height 高
color 颜色
英文 pink
十六进制 #000000
rgb rgb（0-255,0-255,0-255）
background 背景
image 图片
color 颜色
repeat 重复
no-repeat 不重复
repeat-x x轴重复
repeat-y y轴重复
position 定位
left right top bottom center
数字 （x y）
当给一个值的时候 第二个值默认居中
背景图简写
background:url() no-repeat left pink;
行高
line-height
当行高等于高度时 文本垂直居中
水平对齐方式
text-align
center
left
right
border
width style color
solid 实线
dashed 虚线
dotted 点划线
伪类
link 未访问
visited 访问过后
hover 鼠标放上去的时候
active 点击的时候
顺序 lvha
text-decoration
none 去除下划线
underline 下划线
line-through 中划线
overline 上划线
font 字体
size 大小
weight 加粗
bold 加粗
normal 不加粗
style 倾斜
italic 倾斜
normal 不倾斜
family 字体
英文
中文
unicode
font：style weight size/line-height family
text-indent 首行缩进
px
em 最好小于七位数
xHtml规范
必须有文档头
img必须有alt
双标签必须闭合
单标签必须合理闭合
标点符号必须用英文 引号必须用双引号
标签名和属性名必须小写
转化
display:block 把当前元素转化成块元素
inline 行内
inline-block 行内块
嵌套规则
块标签可以包所有
p只能包行内 不能包块
行内只能包行内 不能包自己 也不能包块
a能包所有 但是不能包自己
img能被所有包
行内元素即使转化成块 也不能包块
继承
只有和文字相关的样式 才能继承
i em 不能继承斜体
b strong h 不能继承加粗
a不能继承颜色
选择器
标签选择器
div{}
id选择器
#div{}
类选择器
.div{}
群组选择器
div,p,span{}
嵌套选择器
div p span{}
通配符
*{}
权重/优先级
行间样式>id>class>标签>*
省略号
white-space：nowrap
overflow：hidden
text-overflow：ellipsis
font-family：'微软雅黑'
给宽度
margin 外边距/外补白
top right bottom left
给一个值 上 右 下 左
二 上下 左右
三 上 左右 下
四 上 右 下 左
margin拖拽
overflow：hidden；
border
padding（推荐）
margin合并
取最大值
padding 内边距/内补白
top right bottom left
给一个值 上 右 下 左
二 上下 左右
三 上 左右 下
四 上 右 下 左
padding-left/right 减宽度
padding-top/bottom 减高度
如果子级参照父级宽度 padding不用减
浮动
脱离文档流
合并到一行
文本环绕
行内变成块
宽度不够掉下来
尽可能的往上飘
宽度尽可能的窄 窄到内容的宽度
浮动有方向
left
right
none
同级元素最好都浮动
浮动就得清浮动
清浮动：
overflow：hidden
clear：both（加给同级的）
clearFix:after{ display:block; content:''; clear:both;}
clearFix{ zoom:1;}
position 定位
relative 相对定位
现对于自己定位
不脱离文档流
不改变元素的本质
absolute 绝对定位
脱离文档流
行内变成块
宽度尽可能的窄 窄到内容的宽度
相对于父级定位 父级要有定位
fixed 固定定位
相对于可视区域定位
脱离文档流
行内变成块
宽度尽可能的窄
z-index 层级
数值越大 层级越高
只有定位元素才能用
z-index：2的32次方
form
action href
method
get 不安全
post 相对安全
input 表单
text 文本框
password 密码
submit 提交
radio
name id value
label
for=“id”
checkbox
name id value
label
for=“id”
button 按钮
select 下拉框
option
value（兼容）
textarea
文本域
outline：none 取消焦点
resize：none 取消拖拉
table
thead 表头
tr
th
tbody 表身
tr
td
tfoot 表尾
cellspacing="0"
cellpadding="0"
border-collapse:collapse; 合并单元格
colspan
横向合并
rowspan
纵向合并