黄色网页视频 I 影音先锋日日狠狠久久 I 秋霞午夜毛片 I 秋霞一二三区 I 国产成人片无码视频 I 国产 精品 自在自线 I av免费观看网站 I 日本精品久久久久中文字幕5 I 91看视频 I 看全色黄大色黄女片18 I 精品不卡一区 I 亚洲最新精品 I 欧美 激情 在线 I 人妻少妇精品久久 I 国产99视频精品免费专区 I 欧美影院 I 欧美精品在欧美一区二区少妇 I av大片网站 I 国产精品黄色片 I 888久久 I 狠狠干最新 I 看看黄色一级片 I 黄色精品久久 I 三级av在线 I 69色综合 I 国产日韩欧美91 I 亚洲精品偷拍 I 激情小说亚洲图片 I 久久国产视频精品 I 国产综合精品一区二区三区 I 色婷婷国产 I 最新成人av在线 I 国产私拍精品 I 日韩成人影音 I 日日夜夜天天综合

CSS中純英文換行,純數字換行的問題

系統 5689 0

如下圖所示,當一個定義了寬度的DIV或者其他元素中填充的全部為純英文或者純數字的時候,在IE和火狐中都會被撐大,而不會自動換行

CSS中純英文換行,純數字換行的問題

?

并且當數字或者英文中帶有漢字時,會從漢字處換行,而純漢字卻可以自動換行。這個問題如何解決?先來認識一下兩位主角word-wrap和word-break

word-wrap 用來控制換行
兩種取值:
(1)normal
(2)break-word(此值用來強制換行,內容將在邊界內換行,中文沒有任何問題,英文語句也沒問題。但是對于長串的英文,就不起作用。)

?

word-break 用來控制斷詞
三種取值:
(1)normal
(2)break-all(是斷開單詞。在單詞到邊界時,下個字母自動到下一行。主要解決了長串英文的問題。)
(3)keep-all(是指Chinese, Japanese, and Korean不斷詞,一句話一行,可以用來排列古詩喲~)

【解決方法】
可以在CSS中加入:

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

由于項目的需要,其中一個屬性的值不能超過50個字符限制,在測試的時候發現table中只能顯示大概20多個字符,其余的都被遮蓋掉了,故搜尋了一下解決方案,以備下次再用。

我的測試程序如下:

      <html>
<head>
<title>
測試英文和數字表格換行
</title>
</head>
<body>
<table style="table-layout:fixed;word-break:break-all" width="100%" border="0" cellspacing="0" cellpadding="5" >
<tr>
<th>值</th>
<th>含義</th>
<th>更新時間</th>
<th>操作人</th>
<th>操作</th>
</tr>
<tr>
<td>測試</td>
<td>ABCDGFHGJYABCDGFHGJYABCDGFHGJYABCDGFHGJYABCDGFHGJY</td>
<td>2009-09-18 15:43:24</td>
<td>某人</td>
<td>換行<td>
</tr>
</table>
</body>
</html>
    

?

這里說明一下其中style屬性中的語法:

Html代碼

table-layout :auto | fixed

參數:

Html代碼

auto ?。骸∪笔≡O置. 列寬將設置為不可分割的最大的內容的寬度。
fixed ?。骸”淼膶挾群土械膶挾裙潭?,不隨單元格中內容而改變
1、設置了各個列的寬,沒有設表的寬:表的寬度等于各個列的寬度和
2、設置了表的寬度,沒有設各個列的寬度:各個列的寬度平均分配
3、要是都沒設置寬度:表的寬度為100%,各個列的寬度平均分配

Html代碼

word-break  :  normal  |  break-all  |  keep-all

參數:

Html代碼

normal   :   依照亞洲語言和非亞洲語言的文本規則,允許在字內換行
break-all  :  該行為與亞洲語言的normal相同。也允許非亞洲語言文本行的任 意字內斷開。該值適合包含一些非亞洲文本的亞洲文本
keep-all  :   與所有非亞洲語言的normal相同。對于中文,韓文,日文,不允許字斷開。適合包含少量亞洲文本的非亞洲文本

注意:該語法僅適用于IE內核,對火狐不兼容!

?

CSS中純英文換行,純數字換行的問題


更多文章、技術交流、商務合作、聯系博主

微信掃碼或搜索:z360901061

微信掃一掃加我為好友

QQ號聯系: 360901061

您的支持是博主寫作最大的動力,如果您喜歡我的文章,感覺我的文章對您有幫助,請用微信掃描下面二維碼支持博主2元、5元、10元、20元等您想捐的金額吧,狠狠點擊下面給點支持吧,站長非常感激您!手機微信長按不能支付解決辦法:請將微信支付二維碼保存到相冊,切換到微信,然后點擊微信右上角掃一掃功能,選擇支付二維碼完成支付。

【本文對您有幫助就好】

您的支持是博主寫作最大的動力,如果您喜歡我的文章,感覺我的文章對您有幫助,請用微信掃描上面二維碼支持博主2元、5元、10元、自定義金額等您想捐的金額吧,站長會非常 感謝您的哦?。。?/p>

發表我的評論
最新評論 總共0條評論