css_属性

老师的博客：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来移动自己的位置。
         
         

。