CSS外观样式属性

color:文本颜色

  • 说明

    定义文本的颜色,取值方式有3种:

    1. 预定义颜色值,如red,green,yellow,blue等。
    2. 十六进制,以#开头 0~9 A B C D E F,16进制颜色代码指定颜色的组成方式:前两位表示红色,中间两位表示绿色,最后两位表示蓝色,如#FF0000,#FF6600,#29D794等。实际工作中,十六进制是最常用的定义颜色的方式。
    3. RGB代码,如红色:rgb(255,0,0)或rgb(100%,0%,0%)。
  • 语法

    {color:颜色值;}
  • 注意

    如果使用RGB时,取值为0,不能省略百分号,必须写成0%。

line-height:行高

  • 说明

    即行间距,用于设置文本行高,行与行之间的距离,即字符的垂直间距,一般称为行高。

    常用单位有三种:像素px(常用),相对值em和百分比%。

  • 语法

    {line-height:normal/数值;}
  • 注意

    当行高等于容器高时,可实现文本在容器中垂直方向居中对齐;

    当行高小于容器高时,可实现文本在容器中垂直中齐以上任意位置的定位;

    当行高大于容器高时,可实现单行文本在容器中垂直中齐以下任意位置的定位。(IE6及以下版本存在浏览器兼容问题)

text-align:文本对其方式

水平对齐方式

{text-align:left/right/center;}

垂直对齐方式

{vertical-align:top/bottom/middle;}

text-indent:首行缩进

  • 说明

    用于设置首行文本的缩进。

  • 语法

    {text-indent:value;}
  • 注意

    text-indent可以取负值; text-indent属性只对第一行起作用

text-decoration:文本的装饰)

  • 说明

    通常用于给链接修改装饰效果。

  • 语法

    text-decoration:none/underline/overline/line-through/blink

    none:没有修饰

    underline:添加下划线

    overline:添加上划线

    line-through:添加删除线

    blink:闪烁

  • 注意

text-transform:文本转换

  • 说明

    text-transform将变换应用于文本块。

  • 语法

    {text-transform:none/capitalize/uppercase/lowercase}

    uppercase: 变成全大写
    lowercase :变成全小写
    capitalize :首字母变成大写

letter-spacing:字间距

  • 说明

    用于字符与字符之间的空白。属性值可为不同单位的数值,允许使用负值,默认为normal。

  • 语法

    {letter-spacing:value;}

word-spacing:词间距

  • 说明

    用于定义英文单词之间的间距,对中文字符无效。和letter-spacing一样,其属性值可为不同单位的数值,允许使用负值,默认为normal。

  • 语法

    {word-spacing:value;}
  • 注意

    word-spacing和letter-spacing均可对英文进行设置。不同的是letter-spacing定义的为字母之间的间距,而word-spacing定义的为英文单词之间的间距。CSS外观样式属性

猜你喜欢

转载自blog.51cto.com/biying/2498286