老师的博客：https://www.cnblogs.com/liwenzhou/p/7999532.htm
css的属性
整体属性的：作用于全局
width：表示宽
height：表示长
color：这时是表示字体的颜色
有三种表示的方法：
1.#eeeeee
2.red
3.rgb
4.rgbs
display：表示标签内的元素所有的显示情况
display:"none" HTML文档中元素存在，但是在浏览器中不显示。一般用于配合JavaScript代码使用。
与visiblity：hidden的区别。none是表示不占位置，但是hidden会占位置
display:"block" 默认占满整个页面宽度，如果设置了指定宽度，则会用margin填充剩下的部分。
display:"inline" 按行内元素显示，此时再设置元素的width、height、margin-top、margin-bottom和float属性都不会有什么影响。
display:"inline-block" 使元素同时具有行内元素和块级元素的特点。
float 与clear
float：浮动（一般要与父辈配合）自己是一个块儿及标签，有时会导致父辈标签的塌陷
none：默认值 不浮动left：向左浮动 right：向右浮动
clear：本行带有指定的float便会自立一行。
left 在左侧不允许浮动元素。
right 在右侧不允许浮动元素。
both 在左右两侧均不允许浮动元素。
none 默认值。允许浮动元素出现在两侧。
inherit 规定应该从父元素继承 clear 属性的值。
他两一般配合使用。消除浮动而且不会是父辈标签塌陷的方法
1.display：bolck
2.#id：after{content=''}
3.class:after{content=''}
4.固定高度
推荐使用：.clearfix:after {
content: "";
display: block;
clear: both;
}
overflow：溢出的处理
当文本大于元素的面积处理的办法；
visible 默认值。内容不会被修剪，会呈现在元素框之外。
hidden 内容会被修剪，并且其余内容是不可见的。
scroll 内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。
auto 如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。
inherit 规定应该从父元素继承 overflow 属性的值。
可以单独的的处理x，y方向
overflow-x:
与border配合可以做头像
opsition与right,left,buttom,top
opsition：定位
默认值：static 没有移动位置，top设置等不起作用
relative:相对定位，表示原来的位置移动的位置。原来的位置依然存在
与方向配合使用；
right表示距离右边的距离，且以背景的右边的为参照点
left 表示距离左边的距离，以背景的左边为参照点
button表示距离下边的距离，以背景的下边为参照点
top表示距离上边的距离，以背景的下边为参照点
当这几个都出现时，优先执行left和top的，而不会之行其他的方向。及相对优先来路考虑右下的方向，如果有了高度和宽度的话，就只设置left和top
当为负数时，表示相反的方向走了
absolute：绝对的方位，表示相对长辈的方位。如果上辈没有定相对或者绝对的位置，变执行body的位置，及坐标原点的位置
与方向配合使用；
right表示距离右边的距离，且以背景的右边的为参照点
left 表示距离左边的距离，以背景的左边为参照点
button表示距离下边的距离，以背景的下边为参照点
top表示距离上边的距离，以背景的下边为参照点
同样优先选着left和top。
注意此时是更具长辈的元素的面积（content加上padding的面积）里面的边界的距离，所以当为负数的时候（或者数字太大的时候）变相当于逃出了长辈的区域
fixed：表示始终在屏幕的位置的：可以配合z-index来使用
right表示距离右边的距离，且以背景的右边的为参照点
left 表示距离左边的距离，以背景的左边为参照点
button表示距离下边的距离，以背景的下边为参照点
top表示距离上边的距离，以背景的下边为参照点
同样优先选着left和top。
此时是相对于界面的边框，也是优先left和top
上诉的位置如果背景有高度和宽度是一般只设置left和top，如果没有高度或者宽度时，可以通过bottom和right来把背景来铺开，width默认铺开整个宽度。
方向一般是优先于left和top，不过一般是标签的元素一定时
z-index:叠成顺序，默认值为0
都没有只是后面大于前面，位置定位永远的大于没有位置定位的，有从父现象
opcity：透明度，表示整个背景的透明度，0到1 0透明 1不透明
背景属性：表示一个标签的整体的属性的一般有下面几个属性：
background：表示整个背景的颜色，图片，以及重复的属性。
background的属性：
color img repeat position(200px 或者是top） attachment例如background:#ffffff url('1.png') no-repeat right top fixed;
文字属性(font)：表示文字的各个方面的信息，字体或者大小等等：
font的前缀：
size ：文字的大小px
family:字体的型号
weight：字体的粗细
text的前缀：
align：文本的对齐方式
left（默认） righy center justify
decoration：文本的装饰
none 默认。定义标准的文本。（可以去掉a标签的下划线）
underline 定义文本下的一条线。
overline 定义文本上的一条线。
line-through 定义穿过文本下的一条线。
inherit 继承父元素的text-decoration属性的值。
ident：首行缩进 px 2em
盒子模型：边框，外边距，内边距
margin：外边距，两个元素的外边距是取最大的值 fx
border：边框 外边距与内边距之间的一个框
width：表示宽
color：颜色
radius:半径
可以px也可任意百分比50%表示愿
stylel：样式
none 无边框。
dotted 点状虚线边框。
dashed 矩形虚线边框。
solid 实线边框。
支持简写，而且支持每个边框的单独写，例如border-left-color:
padding：内边距
padding和margin每边单独写。而且可以简写。但是一般是简写四边；
一个px；表示四边
二个：表示上下，左右
三个：上，左右，下
四个：上右下左（顺时针）例如padding: 5px 10px 15px 20px;
标签的背景颜色是在border里面的，也就是说背景颜色会上色在content加上padding不包括border的（border自己可以上色）
padding会忘里面缩的，及padding会为负数的，此时就会出现padding在border的里面了，两个标签实际相遇与其标签的距
离是padding之间的最大值如果你的padding为负数的绝对值大于另外一个的padding的值时，就会发生某个的内容就会被另外
所覆盖了。
但是可以用padding来移动自己的位置。
。