CSS设置段落的水平对齐
CSS设置段落的水平对其方式
CSS中通过属性text-align来设置段落的水平对其方式,可以设置为左、中、右和两端对齐等,控制段落文字的对齐,和word中一样的方便。
<span style="font-size:24px;"><html>
<head>
<title>
水平对齐
</title>
<style>
<!--
p{font-size:12px;}
p.left{text-align:left;}
p.right{text-align:right;}
p.center{text-align:center;}
p.justify{text-align:justify;}
-->
</style>
</head>
<body>
<p class="left">
这个段落采用左对齐的方式,text-align:left,因此文字都采用左对齐。<br>
床前明月光,疑是地上霜。<br>
举头望明月,低头思故乡。<br>李白
</p>
<p class="right">
这个段落采用右对齐的方式,text-align:right,因此文字都采用右对齐。<br>
床前明月光,疑是地上霜。<br>
举头望明月,低头思故乡。<br>李白
</p>
<p class="center">
这个段落采用居中对齐的方式,text-align:center,因此文字都采用居中对齐。<br>
床前明月光,疑是地上霜。<br>
举头望明月,低头思故乡。<br>李白
</p>
<p class="justify">
这个段落采用左对齐的方式,text-align:justify,因此文字都采用左对齐。
床前明月光,疑是地上霜。
举头望明月,低头思故乡。<br>李白
</p>
</body>
</html>
</span>
如上代码,分别使用了text-align属性的四个值,分别实现了左对齐、右对齐,居中对齐和两端对齐的效果。