主頁 > 知識庫 > div css nowrap無換行

div css nowrap無換行

熱門標簽:沈陽400電話辦理多少錢 地圖標注樓盤 快速更改地圖標注點標 南昌電話機器人系統(tǒng) 蘇州做電話機器人 地圖標注微信好友 ai電話機器人效果差 隨州外呼系統(tǒng)廠家 南山電話機器人
 
例如寬度為210px的ul里   分別有4個li 這個4個li的寬度根據(jù)它們的自身內(nèi)容長度為80px、120px、140px、80px。
    我需要的效果是4個li向左自動排列。當?shù)谌齻€li和前兩個li的長度之和大于ul的寬度時候 第三個li則會下移一行。在第二行顯示。而不是把ul撐寬,或者是把自己撐高(內(nèi)容換行,高度增加)
分別定義了ul的寬度210px和li的寬度自動,發(fā)現(xiàn)結(jié)果是:
ul并沒有被撐寬,可惜li也沒有自動到下一樣排列。而是內(nèi)容換行,把li給撐高了。然后死皮賴臉的擠在了第一行。。
    仔細考慮過之后認為問題出在li內(nèi)部內(nèi)容換行上。于是尋找禁止換行的css屬性。
網(wǎng)上查了下沒找到。問了群里永目日月,得到word-break這個屬性。 keep-all;不換行。。
    加到li里后驚奇的發(fā)現(xiàn)問題解決了。
    給工作組做頁面調(diào)試時候卻被人指出顯示有問題。
    走過去一看,顯示的確沒有改變。才想到可能是瀏覽器版本問題。
    我用的是IE7和FF 他們用的IE6。到DW里檢查了一下 發(fā)現(xiàn)word-break這個屬性確實不被IE6支持:
        CSS 屬性 word-break 不受支持Microsoft Internet Explorer 5.0, Microsoft Internet Explorer 5.5, Microsoft Internet Explorer 6.0, Netscape Navigator 6.0, Netscape Navigator 7.0

     實在是郁悶,這個問題以前都有困擾過我。一直也沒解決。
   那位朋友有什么好方法,敬請指教!不勝感謝。


問題已經(jīng)解決。說來可笑。自己在DW里手動敲代碼。
發(fā)現(xiàn)一個屬性里有nowrap,這個nowrap不是word-braek的嗎?難道它能讓不換行?
抱著試試的心理我把它完整敲上
white-space: nowrap;
DW測試沒有出現(xiàn)下劃虛線,意思是瀏覽器支持方面沒有問題。
保存F12。問題解決了。呵呵。。。


順便寫下語法:

語法:
white-space : normal | pre | nowrap 
取值:
normal   : 默認值。默認處理方式。文本自動處理換行。假如抵達容器邊界內(nèi)容會轉(zhuǎn)到下一行 
pre   : 換行和其他空白字符都將受到保護。這個值需要IE6+或者 !DOCTYPE 聲明為 standards-compliant mode 支持。如果 !DOCTYPE 聲明沒有指定為 standards-compliant mode ,此屬性可以使用,但是不會發(fā)生作用。結(jié)果等同于 normal 。參閱 pre 對象 
nowrap   : 強制在同一行內(nèi)顯示所有文本,直到文本結(jié)束或者遭遇 br 對象。參閱 noWrap 屬性 

說明:
設(shè)置或檢索對象內(nèi)空格字符的處理方式。
空格字符,像換行,空格,TAB,在HTML文檔中默認的是被忽略的。當此屬性設(shè)置為 normal 或者 nowrap 時,你可以使用不換行空格的命名實體    來添加空格,用 br 元素來添加換行。此屬性對你使用文檔對象模型(DOM)操作的內(nèi)容的影響與其對IE顯示內(nèi)容的影響一樣。
此屬性作用于塊對象。
此屬性對于 currentStyle 對象而言是只讀的。對于其他對象而言是可讀寫的。
對應(yīng)的腳本特性為 whiteSpace 。 
from:woria.cn
您可能感興趣的文章:
  • javascript 使td內(nèi)容不換行不撐開
  • html小技巧之td,div標簽里內(nèi)容不換行

標簽:濰坊 玉樹 石家莊 昭通 深圳 商洛 大同 濰坊

巨人網(wǎng)絡(luò)通訊聲明:本文標題《div css nowrap無換行》,本文關(guān)鍵詞  div,css,nowrap,無,換行,div,;如發(fā)現(xiàn)本文內(nèi)容存在版權(quán)問題,煩請?zhí)峁┫嚓P(guān)信息告之我們,我們將及時溝通與處理。本站內(nèi)容系統(tǒng)采集于網(wǎng)絡(luò),涉及言論、版權(quán)與本站無關(guān)。
  • 相關(guān)文章
  • 下面列出與本文章《div css nowrap無換行》相關(guān)的同類信息!
  • 本頁收集關(guān)于div css nowrap無換行的相關(guān)信息資訊供網(wǎng)民參考!
  • 推薦文章