CSS文本操控属性

text-indent, 用于首行缩进, 中文网页的文章里会经常用到。

text-indent24px;

当文本字体大小是12px;时,首行缩进2个汉字。

关于文字影藏

在处理网页的LOGO 的时候,我们常常把logo图片作为背景图片引入,例如

<div style="background: url(logo.jpg);"><a href="/">CSS</a></div>

倘若只是这样的话,CSS 文字会显示在logo.jpg 上面,这个时候,可以在 a 标签上加一个 text-indent:-999px; 的属性,意思是将 文字 CSS 向左偏移 999px; 这样文字 CSS 就被隐藏了,有时候点击logo 的时候会有一个很长的虚线框,这是 a 标签的框框。可以根据logo 的大小,设置一下 a 的大小,再加上overflow:hidden; 问题就解决了!

text-justify,IE5+专有属性,只能在IE浏览器里起作用。

auto :  允许浏览器用户代理确定使用的两端对齐法则
inter-word :  通过增加字之间的空格对齐文本。该行为是对齐所有文本行最快的方法。它的两端对齐行为对段落的最后一行无效
newspaper :  通过增加或减少字或字母之间的空格对齐文本。是用于拉丁文字母表两端对齐的最精确格式
distribute :  处理空格很像newspaper,适用于东亚文档。尤其是泰国
distribute-all-lines :  两端对齐行的方式与distribute相同,也同样不包含两段对齐段落的最后一行。适用于表意字文档
inter-ideograph :  为表意字文本提供完全两端对齐。他增加或减少表意字和词间的空格

text-align, 文本或对象对齐方式。
left :  默认值。左对齐
right :  右对齐
center :  居中对齐
justify :  两端对齐

事实上,text-align要和text-justify配合一起用才能实现两端对齐效果(不过在firefox里只需要text-align:justify即可)。

中文大致像这样:

.p {text-align:justify; text-justify:inter-ideograph;}

text-align 常常用于网页居中对齐。

body {text-align:center}
#wrapper { width:900px; margin:auto;}

这样可以让网页里 id 为 wrapper 层在浏览器里相对居中。