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為表意文字文字提供完全兩端對齊。他增加或減少表意字和詞間的空格。

以上是css text-justify屬性的使用詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章！