關於label的強制換行

2021-09-06 05:03:10 字數 2126 閱讀 2875

第一種方法是直接引用樣式:
"

label3

" runat="

server

" width="

350px

" text='

<%# bind("y_question") %>

' cssclass="

label

">

第二種方法:檢視頁面原始碼發現,解析後的label標籤為

所以在頁面新增樣式:

"label3

" runat="

server

" width="

350px

" text='

<%# bind("y_question") %>

' >

gvdata.attributes.add("

style

", "

word-break:keep-all;word-wrap:false

");*************************

//正常換行

gridview1.attributes.add("

style

", "

word-break:keep-all;word-wrap:normal

");//

下面這行是自動換行

gridview1.attributes.add("

style

", "

word-break:break-all;word-wrap:break-word

");在div中,文字布局經常出現,換行混亂的情況。

問題表現:1.如果是全英文本串,中間不包含任何符號(包括空格),不自動換行.

2.中英文混寫,則在英文本串的開始處換行(英文長度》div長度),結尾處不換行。

3.英文整個單詞換行。等等,可能還有一些問題,這裡只列出了常見的幾個;

介紹上面幾個css屬性功能的簡單用法;

word-wrap:normal | break-word; (內容換行)

normal:預設的屬性值.(允許內容頂開指定的容器邊界).

break-word:內容將在邊界內換行(不截斷英文單詞換行,截斷英文單詞下面的屬性才具備這個功能。)

word-break:normal | break-all | keep-all (詞內換行)

normal:如果是中文則到邊界處的漢字換行,如果是英文整個詞換行,注意:如果出現某個英文本串長度超過邊界,則後面的部分將撐開邊框,如果邊框為固定屬性,則後面部分將無法顯示.

break-all : 強行換行,將截斷英文單詞

keep-all : 不允許字斷開。如果是中文將把前後標點符號內的乙個漢字短語整個換行,英文單詞也整個換行,注意:如果出現某個英文.字串長度超過邊界,則後面的部分將撐開邊框,如果邊框為固定屬性,則後面部分將無法顯示.

text-overflow:clip | ellipsis (文字溢位)

clip :  不顯示省略標記(...),而是簡單的裁切

ellipsis :  當物件內文字溢位時(超過width部分)顯示省略標記(...)

white-space: normal | pre | nowrap (內容不換行)

normal 預設。空白會被瀏覽器忽略。

pre 空白會被瀏覽器保留。其行為方式類似 html 中的標籤。

nowrap 文字不會換行,文字會在在同一行上繼續,直到遇到

標籤為止。

(層中放乙個**,如果層的float:none 則**和層間會有空隙,這種問題的解決辦法是在層的style裡面加上white-space: nowrap)

使用方式: word-break:break-all;

一般情況下:

.body

.css

ie與firefox將它看成是乙個長單詞了,因此不會自動換行。

對於ie,可以通過ie專有的css屬性word-wrap即可實現自動換行:word-wrap:break-word;

對於firefox,css2標準並沒有定義類似word-wrap的屬性,可以通過overflow屬性將撐出的部分隱藏:overflow:hidden

強制換行與強制不換行

強制換行與強制不換行用到的屬性 我們一般控制換行所用到的css屬性一共有三個 word wrap word break white space。這三個屬性可以說是專為了文字斷行而創造出來的。首先我們得知道這三個屬性到底是做什麼用地 word wrap語法 word wrap normal 預設 br...

css實現強制不換行 自動換行 強制換行

強制不換行 div自動換行 div強制英文單詞斷行 divcss設定不轉行 overflow hidden 隱藏 white space normal 預設 pre 換行和其他空白字元都將受到保護 nowrap 強制在同一行內顯示所有文字,直到文字結束或者遭遇 br 物件 設定強行換行 word b...

css實現強制不換行 自動換行 強制換行

強制不換行 div 自動換行 div 強制英文單詞斷行 div css設定不轉行 overflow hidden 隱藏 white space normal 預設 pre 換行和其他空白字元都將受到保護 nowrap 強制在同一行內顯示所有文字,直到文字結束或者遭遇 br 物件 設定強行換行 wor...