核心提示:text-align 水平对齐left/center/right左中右justify 两端对齐inherit 继承line-height 文本行间距行高不够时,行与行之间后重叠数字px 数字em数字%...
text-align 水平对齐
left/center/right左中右
justify 两端对齐
inherit 继承
line-height 文本行间距
行高不够时,行与行之间后重叠
数字px 数字em
数字% 基于字体大小的百分比
text-indent 缩进文本
数字% 父元素的百分比
数字px/数字em 固定值默认为0
inherit继承
letter-spacing 字母间距
normal 默认
数字px 固定值(可为负值)
inherit 继承
word-spacing 单词间距
normal 标准间距
数字px 固定值(可正可负)
inherit 继承
direction 文本方向
ltr 从左到右
rtl 从右到左(类似右对齐)
inherit 继承
text-transform 字符转换
capitalize 每个单词首字母大写
uppercase 全部大写
lowercase 全部小写
none 不做改动
text-decoration 文本装饰
underline 下划线
overline 上划线
line-through 在文本中间的贯穿线
blink 文本闪烁
none 关闭原本应用到一个元素上的所有装饰
white-space 处理空白符
normal 像正常的方式那样忽略换行和多余的空格
pre 可以实现pre标签的样式,不忽略空格和换行
nowrap 防止元素换行
pre-wrap 不仅会保留空白符并保留换行符,还允许自动换行
pre-line 保留换行符,并允许自动换行,但是会合并空白符,这是与 pre-wrap 值的不同之处。
他们的区别总结如下:

<html> <head> <style type="text/css"> p.normal{ white-space:normal; } p.pre{ white-space:pre; } p.nowrap{ white-space:nowrap; } p.pre-wrap{ white-space:pre-wrap; } p.pre-line{ white-space:pre-line; } </style> </head> <body> <p class="normal" >normal: This is a normal line This paragraph has many spaces in it </p> <p class="pre" >pre: This is a normal line This paragraph has many spaces in it </p> <p class="nowrap" >newrap: This is a normal line This paragraph has many spaces in it </p> <p class="pre-wrap" >pre-wrap: This is a normal line This paragraph has many spaces in it </p> <p class="pre-line" >pre-line: This is a normal line This paragraph has many spaces in it </p> </body> </html>
