码迷,mamicode.com
首页 > Web开发 > 详细

css中的背景、渐变 文本格式化和表格的常用属性

时间:2016-07-08 23:05:58      阅读:204      评论:0      收藏:0      [点我收藏+]

标签:

一.背景属性background
background属性在一个生命中设置所有的背景属性
scroll:随着页面的其余部分滚动
fixed:固定在窗口的某个位置
语法结构:
background:url(背景图像地址)
1.背景定位(background-position)
值:(1).x% y%第一个值为水平位置,第二个值为垂直位置
    (2).xpx  ypx(同上)
    (3).left在页面或者包含元素的左边显示;
    (4).center在页面或者包含元素的中间显示;
    (5).right在页面或者包含元素的右边显示;
    (6).top在页面或者包含元素的顶部显示;
    (7).bottom在页面或者包含元素的底部显示;
2.背景绘制区域(background-clip)
  值:(1).border-box:背景被裁剪到边框盒;
      (2).padding-box:背景被裁剪到内边距框;
       (3).content-box:背景被裁剪到内容框;
3.背景的定位区域background-origin
  值:(1).border-box:背景图像相对于边框来定位;
      (2).padding-box:背景图像相对于内边距框来定位;
      (3).content-box:背景图像相对于内容框来定位;
二.渐变属性
   渐变指,两种或者多种颜色之间的平滑过渡,可以用在任何使用背景图片的地方.
   有线性渐变.径向渐变和重复渐变.
   使用background-image 属性进行设置
  可以取值:
   (1).linear-gradient:线性渐变
   linear-gradient(angle,color-point1,color-point 2 ….)
   angle:指定渐变的方向,
   (2).radial-gradient:径向渐变
   (3).repeating-linear-gradient:重复线性渐变
   (4).repeating-radial-gradient:重复径向渐变
三.文本格式化概述
    1. 字体属性(为简写属性)
    font:font-style font-variant font-weight font-size font-family;
   不设置的值,使用默认设置
     控制字体
     (1).指定字体
          font-family:value,value2;
     (2)字体大小
         font-size:value;
      (3)字体加粗
         font-style:normal/bold/value;
       (4)字体样式
       font-style:normal/italic;
       (5)小型大写字母显示
         font-variant:normal/amall-caps;
       2.文本属性
         (1)文本颜色 color:value;
         (2)文本排列 text-align:left/right/center; 
         (3)文字修饰 text-decoration:none/underline;
         (4)行高 line-height;value;
         (5)首行文本缩进 text-indent:value;
         (6)文本阴影 text-shadow:h-shadow v-shadow blur color;
         (7)处理空白 whit-space:normal/nowrap;
         (8)文本溢出 text-overflow:clip/ellipsis;
         换行
         (1)长单词换行 word-wrap:normal/break-word;
         (2)文本换行 Word-break:normal/break-all/keep-all;
        四.表格常用样式属性
         1.border: 外边框;
         2.line-height:
        3.text-align:
        .4.vertical-align:
         5.border-collapse:合并单元格之间的边框.
            只能对table的border使用
          6.border-spacing:设定两个单元格之间的间距
              第一个值为水平间距,第二个值为垂直方向的间距.
           7.caption-side:设置表格标题的位置,
            值:top; bottom;
          8.table-layout:用来帮助浏览器如何显示或者布局一张表,既用来设置显示表格单元格.行.列的算法规则
          值:auto:列宽由单元格内容设定,为默认值,即自动表格布局
               fixed:列宽由表格宽度和列宽度设定,既固定表格布局.
           注意:auto:table中的td的宽度和高度会根据内容的多少而变化;
                   fixed:如果是中文的话td的宽度固定,高度根据内容的多少而变化,没有限制,如果是英文的话,内容宽度如果超出就会溢出.
             

css中的背景、渐变 文本格式化和表格的常用属性

标签:

原文地址:http://www.cnblogs.com/wwwzsfcom/p/5654739.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!