這篇文章主要介紹怎么使用CSS實現文本左對齊、右對齊和居中對齊，文中介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們一定要看完！
語法格式：
text-align:(文本位置）
位置 說明
left 左對齊
right 右對齊
center 居中對齊
justify 兩端對齊
接下我們來分別看看這四種對齊方式的設置方法
文本左對齊的設置方法：
text-align：left;
文本右對齊設置方法：
text-align：right;
文本居中對齊設置方法：
text-align：center;
文本兩端對齊設置方法：
text-align：justify;
我們來看具體的代碼示例1：
TextAlign.html
<!DOCTYPEhtml>
<html>
<head>
<metacharset="utf-8"/>
<linkrel="stylesheet"href="TextAlign.css"/>
<title></title>
</head>
<body>
<divclass="TextLeft">
php中文網左對齊<br/>
php中文網<br/>
php中文網<br/>
php
</div>
<divclass="TextRight">
php中文網右對齊<br/>
php中文網<br/>
php中文網<br/>
php
</div>
<divclass="TextCenter">
php中文網居中對齊<br/>
php中文網<br/>
php中文網<br/>
php
</div>
<divclass="TextJustify">
php中文網<br/>
兩端對齊<br/>
php中文網<br/>
php
</div>
</body>
</html>
TextAlign.css
.TextLeft{
margin-top:24px;
margin-left:32px;
border:1pxsolid#ff6a00;
width:480px;
text-align:left;
}
.TextRight{
margin-top:24px;
margin-left:32px;
border:1pxsolid#ff6a00;
width:480px;
text-align:right;
}
.TextCenter{
margin-top:24px;
margin-left:32px;
border:1pxsolid#ff6a00;
width:480px;
text-align:center;
}
.TextJustify{
margin-top:24px;
margin-left:32px;
border:1pxsolid#ff6a00;
width:480px;
text-align:justify;
text-justify:distribute-all-lines;
}
以上是“怎么使用CSS實現文本左對齊、右對齊和居中對齊”這篇文章的所有內容，感謝各位的閱讀！希望分享的內容對大家有幫助，更多相關知識，歡迎關注億速云行業資訊頻道！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
