CSS禁止文字自動換行

來源:互聯網
上載者:User
 當中文文字很長的時候(中間沒有空格也沒有分行符號號),不管是IE還是firefox,到達邊界都會自動換行。 但是有的情況,我們並不希望這樣。比如:當在幾個li並排排列,不想讓每行的最後的一個li的文字自動換行,那就可以使用"white-space:nowrap"這個屬性了。

  使用這個CSS屬性之後,文本只有在遇到空格或者是分行符號的時候才能換行,比如:
<style type="text/css">
div{width:300px;border:1px solid red;margin:10px;overflow:hidden;}
.nowrap{white-space:nowrap;}
</style>
<div class="nowrap">這是一段很長的文字,中間沒有空格,也沒有換行,它不會自動換行直到被截取掉</div>
<div>這是一段很長的文字,中間沒有空格,也沒有換行,但它會自動換行</div>

  上面兩個div裡超寬的文字,第一個裡面的被禁止換行,然後超寬的被截取了;第二個不做設定,於是自動換行了。

相關文章

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.