CSS3的chapter4

　　段落样式：

• • 行高——line-height
    

    p { line-height:25px | 150% | normal;}

  • 段落缩进——text-indent
    

    p { text-indent:2em;}

  • 段落对齐——text-align
    

    p { text-align:left | center | right | justify;}

  • 文字间距——letter-spacing
    

    p { letter-spacing:5px | normal;}

  • 文字溢出——text-overflow
    text-overflow：clip ——将内容裁切掉
    text-overflow：elipsis——内容替换为省略号
         注意：要先定义强制文本在一行显示——white-space:nowrap及溢出内容为隐藏——overflow:hidden ，才有显示省略号的效果。

    p{

             overflow: hidden;    

             white-space: nowrap;

             text-overflow: ellipsis;

    }

  • 段落换行——word-wrap
    word-wrap：normal | break-word
    

　　背景样式：

• • 背景颜色——background-color
    body { background-color:#CCCCCC | rgba(255,0,0,.5) | rgb(255,0,0) | transparent;}
  • 渐变——linear-gradient/radial-gradient
    background-image:linear-gradient(to left, red 30%,blue);
  • 背景图片——background-image
    body { background-image:url(images/bg.jpg);}
  • 背景平铺方式——background-repeat
    body { background-repeat:repeat-x | repeat-y | no-repeat | repeat;}
  • 背景定位——background-position
    

    body { background-position:left bottom/30% 30%/20px 20px;}

  • 背景原点——background-origin
    注意：必须设置背景平铺为background-repeat:no-repeat才生效
    

    body {background-origin:border-box | padding-box | content-box;}

  • 背景显示区域——background-clip
    

    body {background-clip:border-box | padding-box | content-box | text }

  • 背景尺寸——background-size
    

    body { background-size:80px 60px | 80% 60% | auto | cover | contain;}

  • 缩写
    

    body {

             background-color:# EDEDED;

             background-image:url(images/bg.png);

             background-repeat:no-repeat;

             background-position:50%  30px;

    }

    body { background:#EDEDED url(images/bg.png) no-repeat 50% 30px;}

　　列表样式：

• • 项目符号——list-style-type
    ul { list-style-type:disc | circle | square | none | decimal | lower-roman | upper-alpha;}
  • 自定义项目符号——list-style-image
    ul {list-style-image:url(images/arrow.gif)}