文本对齐方式也是排版中常用的属性,由于不同语言的阅读顺序可能不同,所以网页设计时要考虑文本对齐。

这一节的HTML代码如下:

<body>
<h1>这是标题 1</h1>
<h2>这是标题 2</h2>
<h3>这是标题 3</h3>
</body>

文本对齐使用属性text-align,它有3个值可以选择:

01 text-align: center    /*文本居中对齐*/
02 text-align: left      /*文本左对齐*/
03 text-align: right     /*文本右对齐*/

文本居中经常用在将文字调整到元素的中央位置上,如要文字位于按钮的中央,通常使用下面的代码:

01 text-align:center;
02 line-height:15px;

其中第1行使得按钮上的文字水平居中,

第2行中的line-height为行高的设置,如同Word中对文字行高的设置一样,当指定一行文字的高度后,文字会在该行的中部显示(行高是影响上一行和下一行与本行距离的属性),当设置行高为按钮的高度时,按钮上方的文字自然显示在按钮的中部了。

注意: text-align与center标签的效果似乎相同,实际上却是不相同的,因为center标签同时会使得元素居中。