本文章來給各位同學(xué)介紹css怎樣讓英文字母數(shù)字自動(dòng)換行且不斷詞方法總結(jié)，有需要了解的同學(xué)可進(jìn)入?yún)⒖肌?/p>

當(dāng)一個(gè)定義了寬度的塊狀元素中填充的全部為純英文或者純數(shù)字的時(shí)候，在IE和FF中都會(huì)撐大容器，不會(huì)自動(dòng)換行

并且當(dāng)數(shù)字或者英文中帶有漢字時(shí)，會(huì)從漢字處換行，而純漢字卻可以自動(dòng)換行。這個(gè)問題如何解決？先來認(rèn)識(shí)一下兩位主角word-wrap和word-break

word-break用來控制斷詞

三種取值：

(1)normal

(2)break-all(是斷開單詞。在單詞到邊界時(shí)，下個(gè)字母自動(dòng)到下一行。主要解決了長串英文的問題。)

(3)keep-all

word-wrap用來控制換行

兩種取值：

(1)normal

(2)break-word(此值用來強(qiáng)制換行，內(nèi)容將在邊界內(nèi)換行，中文沒有任何問題，英文語句也沒問題。但是對于長串的英文，就不起作用。)

解決方法

可以在CSS中加入 代碼如下 復(fù)制代碼

word-wrap:break-word;

word-break:break-all;

.(Firefox瀏覽器)連續(xù)的英文字符和阿拉伯?dāng)?shù)字的斷行,Firefox的所有版本的沒有解決這個(gè)問題,我們只有讓超出邊界的字符隱藏或者,給容器添加滾動(dòng)條 代碼如下 復(fù)制代碼

#wrap{word-break:break-all; width:200px; overflow:auto;}

abcdefghijklmnabcdefghijklmnabcdefghijklmn111111111

效果：容器正常，內(nèi)容隱藏

對于table

1. (IE瀏覽器)使用table-layout:fixed;強(qiáng)制table的寬度,多余內(nèi)容隱藏 代碼如下 復(fù)制代碼

abcdefghigklmnopqrstuvwxyz1234567890ssssssssssssss

效果：隱藏多余內(nèi)容

2.(IE瀏覽器)使用table-layout:fixed;強(qiáng)制table的寬度,內(nèi)層td,th采用word-break : break-all;或者word-wrap : break-word ;換行 代碼如下 復(fù)制代碼

abcdefghigklmnopqrstuvwxyz 1234567890

abcdefghigklmnopqrstuvwxyz 1234567890

效果：可以換行

例子 代碼如下 復(fù)制代碼

SS

英文對齊:

¨Crepower¨ Brand Belts, Chains and other Transmission Parts are manufactured under ISO9001 certified quality-control system. With improved quality material and well-organized production procedures, ¨Crepower¨ power transmission products have noticeably fatigue strength and long-service life.We can supply all types and sizes according to the related standards and customers’ requirements and

總結(jié)

以上是生活随笔為你收集整理的css怎么控制两个字母,css英文字母数字自动换行且不断词方法的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。