★宽和高
width属性可以为元素设置宽度。
height属性可以为元素设置高度。
块级标签才能设置宽度，内联标签的宽度由内容来决定。
★字体属性
文字字体 font-family 字体大小 font-size 字重(粗细) font-weight 文本颜色 color
★文本属性
文本对齐 text-align 文字装饰 text-decoration 首行缩进 text-indent
left 左边对齐
right 右对齐
center 居中
justify 两端对齐
none 默认,定义标准文本 underline 定义文本下的一条线 overline 定义文本上的一条线 line-through 定义穿过文本中的一条线 inherit 继承父元素的text-decoration属性的值
★背景属性
支持简写:background:#ffffff url('1.png') no-repeat right top;
背景颜色 background-color
背景图片 background-image:url("图片地址")
背景重复 background-repeat
背景位置 background-position
固定不动 background-attachment:fixed
repeat(默认) 背景图片平铺排满整个页面 repeat-x 背景图片只在水平方向上平铺 repeat-y 背景图片只在垂直方向上平铺 no-repeat 背景图片不平铺
left
right
top
bottom
100px 100px 通过像素位置定位
50% 50% 通过百分比定位
★边框
支持简写:border: 2px solid red
边框宽度 border-width 边框样式 border-style 边框颜色 border-color 圆形边框 border-radius:50%
none 无边框
dotted 点状虚线边框
dashed 矩形虚线边框
solid 实线边框 --> 常用
border-top-color 上 颜色 border-bottom-style 下 样式 border-left-color 左 颜色 border-right-width 右 宽度
★display属性
display:inline-block;
none 不显示
inline 行内显示
block 块显示
inline-block 同时具备块元素和行内元素的特点
★列表的样式
不显示圆点 list-style-type:none
★盒子模型
margin: 用于控制元素与元素之间的距离；
padding: 用于控制内容与边框之间的距离；
Border(边框): 围绕在内边距和内容外的边框。
Content(内容): 盒子的内容，显示文本和图像。
★float浮动属性
left 向左浮动
right 向右浮动
none 不浮动
★clear清除浮动效果
left 在左侧不允许浮动元素
right 在右侧不允许浮动元素
both 在左右两侧均不允许浮动元素
none 默认值。允许浮动元素出现在两侧
inherit 规定应该从父元素继承 clear 属性的值
★overflow溢出属性
visible 默认值。内容不会被修剪，会呈现在元素框之外
hidden 内容会被修剪，并且其余内容是不可见的
scroll 内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容
auto 如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容
inherit 规定应该从父元素继承 overflow 属性的值
★position定位属性
static 默认
relative 相对定位
相对于该元素在文档流中的原始位置，即以自己原始位置为参照物
即使设定了元素的相对定位以及偏移值，元素还占有着原来的位置，即占据文档流空间
left
right
top
bottom
absolute 绝对定位
相对于最近的已定位过的祖先元素定位
设置为绝对定位的元素框从文档流完全删除
left
right
top
bottom
absolute 绝对定位
★透明度opacity属性
可以改变元素和子标签的透明度
范围:0~1
和rgba的区别:
rgba只设置背景的透明度
★z-index
设置对象的层叠顺序，
数值大的会覆盖在数值小的标签之上。
z-index 仅能在定位元素上奏效。
补充:
脱离文档流的三种方式:
1,浮动
2,绝对定位
3,固定定位