使用text-align:justify實現左右對齊一例_經驗交流

來源:互聯網
上載者:User
text-align:justify只能對多行中的非最後一行進行左右對齊。對於單行自己沒辦法,IE有text-justify 可以解決問題,對了非IE的我的方式比較垃圾,因為只在特殊場合下才會用。

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還增加內容達到有第二行,才會在第一行左右對齊。

  不過各瀏覽器對中文的理解不一樣。Firefox 是直接分割中文,Opera不會分割中文,只認空格,要是在中文中間插點半形的英文或者標號它還會對不齊,safari接近Opera。都是不加空格沒法分。

  英文比較好,因為大家只能用空格分來單詞,不過IE用text-justify :distribute-all-lines來分真是難看得要命。本來想過用htc或者js幫IE,可是發現,IE6好笨的說,家裡沒IE7不知道怎樣。

  或者敲空格是一種比較好的方式,可firefox這種只放大文本的瀏覽器一放大文字就XX了,我寫的那個爛方法也只有在一定的情況下有用,想起一句話:珍惜生命,遠離Firefix!
  • 相關文章

    A Free Trial That Lets You Build Big!

    Start building with 50+ products and up to 12 months usage for Elastic Compute Service

    • Sales Support

      1 on 1 presale consultation

    • After-Sales Support

      24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.