使用text-align:justify實(shí)現(xiàn)兩端對齊一例
更新時間：2007年09月23日 19:25:35 作者：
text-align:justify只能對多行中的非最后一行進(jìn)行兩端對齊。對于單行自己沒辦法，IE有text-justify 可以解決問題，對了非IE的我的方式比較垃圾，因?yàn)橹辉谔厥鈭龊舷虏艜谩?
Example Source Code [www.52css.com]
.justify{
height:1.1em;
overflow:hidden;
text-align:justify;
text-justify :distribute-all-lines;
}
div.cn:after {
content: "__________________________________________";
font-size:100px;
}
對了非IE的我是使用content還增加內(nèi)容達(dá)到有第二行，才會在第一行兩端對齊。
不過各瀏覽器對中文的理解不一樣。Firefox 是直接分割中文，Opera不會分割中文，只認(rèn)空格，要是在中文中間插點(diǎn)半角的英文或者標(biāo)號它還會對不齊，safari接近Opera。都是不加空格沒法分。
英文比較好，因?yàn)榇蠹抑荒苡每崭穹謥韱卧~，不過IE用text-justify :distribute-all-lines來分真是難看得要命。本來想過用htc或者js幫IE，可是發(fā)現(xiàn),IE6好笨的說，家里沒IE7不知道怎樣。
或者敲空格是一種比較好的方式，可firefox這種只放大文本的瀏覽器一放大文字就XX了，我寫的那個爛方法也只有在一定的情況下有用，想起一句話：珍惜生命，遠(yuǎn)離Firefix!
Example Source Code [www.52css.com]
.justify{
height:1.1em;
overflow:hidden;
text-align:justify;
text-justify :distribute-all-lines;
}
div.cn:after {
content: "__________________________________________";
font-size:100px;
}
對了非IE的我是使用content還增加內(nèi)容達(dá)到有第二行，才會在第一行兩端對齊。
不過各瀏覽器對中文的理解不一樣。Firefox 是直接分割中文，Opera不會分割中文，只認(rèn)空格，要是在中文中間插點(diǎn)半角的英文或者標(biāo)號它還會對不齊，safari接近Opera。都是不加空格沒法分。
英文比較好，因?yàn)榇蠹抑荒苡每崭穹謥韱卧~，不過IE用text-justify :distribute-all-lines來分真是難看得要命。本來想過用htc或者js幫IE，可是發(fā)現(xiàn),IE6好笨的說，家里沒IE7不知道怎樣。
或者敲空格是一種比較好的方式，可firefox這種只放大文本的瀏覽器一放大文字就XX了，我寫的那個爛方法也只有在一定的情況下有用，想起一句話：珍惜生命，遠(yuǎn)離Firefix!
相關(guān)文章
絕對定位的DIV寬度自動適應(yīng)的一個方法...2007-02-02
很不錯的 CSS Hack 又學(xué)了一招...2007-03-03
2008-02-02
用CSS讓表格返轉(zhuǎn)的代碼 IE only...2007-03-03
解析IE, FireFox, Opera 瀏覽器支持Alpha透明的方法
解析IE, FireFox, Opera 瀏覽器支持Alpha透明的方法...2006-12-12
2006.12.06更新 TopStyle剪輯庫...2006-12-12
被人遺忘的html tags...2007-02-02
div+CSS網(wǎng)頁布局的意義與副作用原因小結(jié)
隨著WEB2.0標(biāo)準(zhǔn)化設(shè)計(jì)理念的普及，國內(nèi)很多大型門戶網(wǎng)站已經(jīng)紛紛采用DIV+CSS制作方法，從實(shí)際應(yīng)用情況來看，此種方法絕對好于表格制作頁面的方法。2008-09-09
css 縮寫2008-06-06
從今天開始，我將全面的共享出我所能理解的所有WEB標(biāo)準(zhǔn)方面的知識放在這個“WEB標(biāo)準(zhǔn)能有多難？”的專欄里。當(dāng)然由于振之的水平有限，所講并非是完全正確的。在看了這個專欄的文章的時候要理性的分析，要有自己的判斷，歡迎各位朋友提出自己的看法與意見。2008-04-04