您好,登錄后才能下訂單哦!
小編給大家分享一下css中white-space屬性的使用方法,相信大部分人都還不怎么了解,因此分享這篇文章給大家參考一下,希望大家閱讀完這篇文章后大有收獲,下面讓我們一起去了解一下吧!
css white-space 屬性用于設(shè)置如何處理元素內(nèi)的空白,例設(shè)置white-space: nowrap,則換行及行首尾空格全部被合并,文本不會(huì)換行,文本會(huì)在在同一行上繼續(xù),直到遇到 <br> 標(biāo)簽為止。
css white-space屬性怎么用?
white-space 屬性設(shè)置如何處理元素內(nèi)的空白。
這個(gè)屬性聲明建立布局過程中如何處理元素中的空白符。
語法:
white-space : normal | pre | nowrap | pre-wrap | pre-line ;
屬性值:
normal:默認(rèn)??瞻讜?huì)被瀏覽器忽略。
pre:空白會(huì)被瀏覽器保留。其行為方式類似 HTML 中的 <pre> 標(biāo)簽。
nowrap:文本不會(huì)換行,文本會(huì)在在同一行上繼續(xù),直到遇到 <br> 標(biāo)簽為止。
pre-wrap:保留空白符序列,但是正常地進(jìn)行換行。
pre-line:合并空白符序列,但是保留換行符。
說明:值 pre-wrap 和 pre-line 是 CSS 2.1 中新增的。
注釋:任何的版本的 Internet Explorer (包括 IE8)都不支持屬性值 "inherit"。
css white-space屬性 示例
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> </head> <head> <style type="text/css"> .box{ width: 500px; border: 1px solid #000; margin-bottom:10px ; } .p1 { white-space: nowrap } </style> </head> <body> <div class="box"> <p> 億速云 億速云 億速云 億速云 億速云 億速云 億速云 億速云 億速云 </p> </div> <div class="box"> <p class="p1"> 億速云 億速云 億速云 億速云 億速云 億速云 億速云 億速云 億速云 </p> </div> </body> </html>
以上是css中white-space屬性的使用方法的所有內(nèi)容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內(nèi)容對(duì)大家有所幫助,如果還想學(xué)習(xí)更多知識(shí),歡迎關(guān)注億速云行業(yè)資訊頻道!
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場,如果涉及侵權(quán)請(qǐng)聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。