css text-justify屬性的使用詳解

文法：

text-justify : auto |inter-word | newspaper | distribute | distribute-all-lines | inter-ideograph

參數：
auto : 　允許瀏覽器使用者代理程式確定使用的左右對齊法則
inter-word : 　通過增加字之間的空格對齊文本。該行為是對齊所有文本行最快的方法。它的左右對齊行為對段落的最後一行無效
newspaper : 　通過增加或減少字或字母之間的空格對齊文本。是用於拉丁文字母表左右對齊的最精確格式
distribute : 　處理空格很像newspaper，適用於東亞文檔。尤其是泰國
distribute-all-lines : 　左右對齊行的方式與distribute相同，也同樣不包含兩段對齊段落的最後一行。適用於表意字文檔
inter-ideograph : 　為表意字文本提供完全左右對齊。他增加或減少表意字和詞間的空格

說明：
設定或檢索對象內文本的對齊。
對應的指令碼特性為textJustify。請參閱我編寫的其他書目。

樣本：

div {text-justify : auto; }

我們有時候會使用本文文字左右對齊，從而達到美化模板的目的。那麼文字左右對齊是怎麼實現的以及要注意什麼問題，詳情如下：

目前，對於英文文章，只需要設定 text-align:justify; 就可以實現左右對齊，如下例：

英文左右對齊的設定代碼

<p style="text-align:justify;width:500px;margin:10px auto;border:1px solid red;padding:10px;">

This is the effect of the English text:Start:W3Schools is optimized for learning, testing, and training. Examples might be simplified to improve reading and basic understanding.Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using this site, you agree to have read and accepted our terms of use and privacy policy.End.

如果您要處理的是中文，則還需要添加text-justify:inter-ideograph屬性，如下例：

中文左右對齊的設定代碼

<p style="text-align:justify;text-justify:inter-ideograph;width:500px;margin:10px auto;border:1px solid red;padding:10px;">

這是中文文字的效果：測試文字內容區開始：創想資訊網—前端開發欄目，關注網站設計、前端開發。創想資訊網其他關注方向有——dedecms二次開發、標籤使用及最佳化，電腦故障排除，學習資源分享，開發工具推薦，視頻教程匯總，精彩博文推薦，社會經驗、情感經曆分享、資料庫使用以及幾個常見的web項目營運。

注意：

標點符號會對布局對齊造成影響，預設情況下大部分主流瀏覽器會避免讓標點符號佔據行首，此問題控制較為複雜。

有空格的情況亦不相同，在行末有空格會在此自動換行，標點符號也可在下一行首。

下面創想資訊網帶大家複習下CSS中text-justify的知識：

text-justify: 參數如下

auto允許瀏覽器使用者代理程式確定使用的左右對齊法則

inter-word通過增加字之間的空格對齊文本。它的左右對齊行為對段落的最後一行無效。

newspaper增加或減少字或字母之間的空格對齊文本。是用於拉丁文字母表左右對齊的最精確格式。

distribute處理空格很像newspaper，適用於東亞文檔。尤其是泰國。

distribute-all-lines左右對齊行的方式與distribute相同，也同樣不包含兩段對齊段落的最後一行。

inter-ideograph為表意字文本提供完全左右對齊。他增加或減少表意字和詞間的空格。