css中的部分样式总结

1.列表样式
    list-style  
        list-style-type
        list-style-image
        list-style-position    
 
   list-style-type  设置列表项标志类型
     取值:                
         none  没有类型         
         disc   一个实心的小黑圆圈        
         circle    一个空心的小圆圈         
         square    一个黑块    
         decimal     数字    
         lower-roman 小写罗马数字（E.g. i, ii, iii, iv, v…—）    
         upper-roman     大写罗马数字 （E.g. I, II, III, IV, V…）
         decimal-leading-zero  十进制的值（E.g. 01, 02, 03, … 98, 99）
    
    list-style-image
         none   没有图片
         url()    图片的路径

    list-style-position    
         outside   [默认值]显示在主块的外部
         inside    显示在主块的内部

   其他样式：
      cursor  （鼠标样式）调整光标悬浮到链接上的时候光标的形状
        url    需使用的自定义光标的 URL。注释：请在此列表的末端始终定义一种普通的光标，以防没有由 URL 定义的可用光标。鼠标样式栈 url('./images/zhankai.png'), help
        default    默认光标（通常是一个箭头）
        auto     默认。浏览器设置的光标
        pointer    手型
        crosshair  十字交叉
        wait    等待
        help    帮助
        move    移动
        text    文本
    
    line-height 行高
        给元素设置行高等于盒子的高度，那么盒子中的文本将垂直居中

    outline    环绕边框，速写属性
       类似于盒子的边框，但是不占空间

    display   控制盒子的显示方式
      inline    行内显示，宽高无效(行内元素)
      block    块级显示，宽高有效（块级元素）
      inline-block    行内显示同时宽高有效
      none        不显示，不占据屏幕空间

    visibility    显示与隐藏
       hidden   隐藏，占据屏幕空间
       visible    显示

    opacity     透明度，0-1之间的取值，取值为0的时候隐藏，占据屏幕空间

    overflow     溢出处理
        hidden 超出内容隐藏
        auto     超出产生滚动条
        scroll   滚动条

    盒子相关的样式：
       每一个元素都是一个盒子
     width  宽度
     height  高度
     padding   内边距   =>padding-top 、padding-right、padding-bottom、padding-left  
     margin   外边距    =>margin-top、margin-right、right-bottom、margin-left
     
     border  边框
           border-width        为元素指定边框的宽度
             取值：
               关键字    thin 、medium、thick
               单位    px、em

           border-style        为元素指定边框样式
             取值：
                none    不设置
                hidden     隐藏
                dotted     显示一系列的点
                dashed 显示一系列小线段
                solid     显示一条单一的实心直线
                double     显示两条实心直线
                groove     边框雕刻效果(与ridge相反)
                ridge     与groove相反
                inset     嵌入式边界框(与outset相反)
                outset     突出的边界框

           border-color        为元素指定边框颜色
              取值:
                 关键字
                 十六进制
                 RGB
                 HSL
                 RGBA
                 HSLA

           border-radius        为元素指定圆角边框的半径
              取值:
                  绝对值     px、mm 、cm
                  相对值     em 、rem

           border         边框相关属性的速记写法

            背景（Backgrounds）
                 background-color         为元素设置一种颜色
                   关键字
                   十六进制
                   RGB
                   HSL
                   RGBA
                   HSLA
                 background-image    为元素设置一个背景图片
                    none
                    url()
                 background-size  设置背景的大小
                    cover
                    contain
                    百分比
                    绝对值
                 background-repeat     设置背景图片的重复方式
                    repeat         为了覆盖整个背景范围，背景图片尽可能多的重复，在背景边缘切割(clipping)最后一个图片以使用整个背景范围。
                    repeat-x            x方向平铺一行
                    repeat-y         y方向平铺一行
                    no-repeat    不重复

                 background-origin     设定背景的起始点
                    padding-box    默认，背景图片从内边距的外边缘开始绘制
                    border-box    背景图片从边框的外边缘开始绘制    
                    content-box    背景图片从内容区开始绘制

                 background-clip     设定背景的覆盖范围
                    border-box    默认，背景位于边框以内
                    padding-box    背景位于内边距以内
                    content-box    背景位于内容区

                 background-attachment     设置背景图片的固定点
                    scroll
                    fixed
                    local
                 background-position  设置为背景图像初始位置，可以实现图片精灵
                    关键字
                      top left
                      top center
                      top right
                      center left
                      center center
                      center right
                      bottom left
                      bottom center
                      bottom right
                    坐标

                 background 背景设置的速记写法
                    [<attachment>][<clip>][<color>][<image>][<position>][<repeat>]

        盒子模型：
          所有的元素都可以看作一个盒子
            内容盒子（W3C盒子、标准盒子）  默认
              box-sizing：content-box
               width=内容的宽度

            边框盒子（怪异盒子、IE盒子）
               box-sizing:border-box
                width=内容 + padding + border

        元素的默认样式
          body    默认有一个外边距
          ul      默认有margin、padding、list-style

2.文本相关的样式
    文字相关的样式（可以被继承）
     color    给文字指定颜色(关键字、十六进制、rgb函数、rgba函数)
     font-family  给文本设置字体（字体栈或字体族）
            serif         有衬线的字体,笔画结尾有特殊的装饰线或衬线
            sans-serif    无衬线的字体，笔画结尾是平滑的字体
            monospace    等宽字体，用于代码，字体中每个字宽度相同
            cursive         草书，这种字体有的有连笔，有的还有特殊的斜体效果。
            fantasy     梦幻装饰字体 ，具有特殊艺术效果的字体
    
    网络字体:
        font-family 为文字指定特殊的字体，浏览器只会使用浏览器可以访问到的字体。

            @font-face{
                font-family: myfont;
                src:url(./FZWangXZXKJW.TTF)
            }
            p{
                font-family: myfont;
            }

        font-style 用于关闭和打开斜体
            normal        【默认】正常字体，关闭斜体
            italic         斜体                
            oblique        模拟斜体
        
        font-weight 设置字体的粗细程度
            normal        【默认】正常,400
            bold         加粗字体,700                
            lighter        设置当前元素字体比父元素更细
            bolder        设置当前元素字体比父元素更粗
            100–900     数值类型的粗细程度（值越大字体越粗）

        text-align 文字排列方式
            left     左对齐
            center    居中
            right    右对齐

        text-transform 允许字体改变，文本变形                    
            none         防止任何改变            
            uppercase    将文本转换为大写                
            lowercase    将文本转换为小写        
            capitalize    将所有单词第一个字母转换为大写
            full-width    转换为类似于一个等宽字体

       text-decoration(line style color)         
         设置或者取消文本修饰
         速写属性  line style color            
        
        text-decoration-line 线的种类    
           none          取消所有文本修饰            
           underline      为文本添加下划线            
           overline      为文本添加上划线            
           line-through     为文本添加删除线
        
        text-decoration-style  线的样式
             solid(实线)
             wavy(波浪线)
             dashed(虚线)
             dotted(点状线)
             double(双实线)
        
        text-decoration-color  颜色
          关键字  十六进制   rgb函数   rgba函数
        
        text-shadow 设置或者取消文本阴影            
            none           取消所有阴影            
            h-shadow       必需。水平阴影的位置。允许负值        
            v-shadow      必需。垂直阴影的位置。允许负值        
            blur          可选。模糊的距离
            color          可选。阴影的颜色。参阅 CSS 颜色值