首頁 >web前端 >css教學 >詳解CSS中的空白效果屬性使用

詳解CSS中的空白效果屬性使用

高洛峰
高洛峰原創
2017-03-08 15:26:511912瀏覽

white-space

white-space用來設定瀏覽器對「空白」的處理,所謂的空白指的是你在編輯器裡面輸入的空格,回車,tab等。他的可選內容如下:

normal: 預設。空白會被瀏覽器忽略。例如:開頭結尾的空白忽略,字之間的,不管多少個多個空格或回車,只顯示一個空格,換行前面的空格忽略
pre:空白會被瀏覽器保留。其行為方式類似 HTML 中的 e03b848252eb9375d56be284e690e873 標籤。
nowrap:不換行,除非遇到df250b2156c434f3390392d09b1c9563,n個空格會被壓縮成一個。
pre-wrap:保留所有空白,但正常地進行換行(chrome,FF,IE8+,Opera),在IE6和IE7下等同於normal
pre-line:合併空白符序列(合併成一個) ,但保留換行符(chrome,FF,IE8+,Opera),在IE6和IE7下面等同於normal

word-spacing與letter-spacing
#word-spacing 只能作用於英文的字與字間,對於中文無效
letter-spacing 可以作用於中文。

<html>   
 <head>   
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"></meta>   
  <style type="text/css">   
   p.spread {letter-spacing: 30px;}   
  </style>   
 </head>   
 <body>   
  <p class="spread">This is some text.哈哈哈哈哈哈哈</p>   
  <p class="tight">This is some text.This is some text.</p>   
 </body>   
</html>

以上是詳解CSS中的空白效果屬性使用的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn