`

网页中CSS实现超长英文、数字自动换行

 
阅读更多

浏览器中对于英文、数字超出容器宽度的处理是将整个不包含空格的单词换行,而不将单词及数字截断,这种处理是人性化的,但有时候遇到超长英文或数字时,却因为这种处理方式而导致容器宽度被撑大,致使页面非常难看,而通过CSS我们可以使其强制换行:

英文字符、数字强制换行:

数字强制换行,英文字符不强制:

[ACM_HDU_1297]Children’s Queue一文中,题目中的英文单词仍人性化判断是否换行,而下面的超长数字则强制自动换行。


原文地址(本人博客):http://lanfei.sinaapp.com/2012/04/386.html

欢迎访问交流。



分享到:
评论

相关推荐

    css控制文字自动换行

    css控制字母、数字文字自动换行方法css控制文字自动换行css控制文字自动换行

    CSS实现连续数字和英文的自动换行的方法

    对于div,p等块级元素 正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义的宽度之后自动换行: html 正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义...

    CSS代码使纯英文数字自动换行的简单实现

    当一个定义了宽度的块状元素中填充的全部为纯英文或者纯数字的时候,在IE和FF中都会撑大容器,不会自动换行 并且当数字或者英文中带有汉字时,会从汉字处换行,而纯汉字却可以自动换行。这个问题如何解决?先来认识...

    css 英文换行 css(word-wrap/break)使纯英文数字自动换行

    当一个定义了宽度的块状元素中填充的全部为纯英文或者纯数字的时候,在IE和FF中都会撑大容器,不会自动换行并且当数字或者英文中带有汉字时,会从汉字处换行,而纯汉字却可以自动换行。这个问题如何解决?先来认识...

    css表格单元格中的长文本如何实现自动换行

    自动换行问题,正常字符的换行是比较合理的,而连续的数字和英文字符常常将容器撑大,挺让人头疼。下面介绍的是CSS如何实现换行的方法 对于div,p等块级元素 正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的...

    css实现连续的英文或数字自动换行的方法

    大家都知道连续的英文或数字能是容器被撑大,不能根据容器的大小自动换行,下面是 CSS如何将他们换行的方法

    CSS网页制作时实现自动换行的小技巧

    大家都知道连续的英文或数字能是容器被撑大,不能根据容器的大小自动换行,下面是 CSS如何将他们换行的方法!  对于div  1.(IE浏览器)white-space:normal; word-break:break-all;这里前者是遵循标准。 #wrap{...

    css之自动换行实现代码

    正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义的宽度之后自动换行 html <div id=wrap>正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义</div> css #...

    js实现连续英文字符自动换行兼容ie6 ie7和firefox

    英文字符自动换行,通过js脚本截断字符串,此方法通用ie6,ie7,firefox,使用CSS控制强制换行实现不了的朋友可以尝试下

    对于div,p等块级元素css如何实现自动换行

    正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义的宽度之后自动换行 html 复制代码代码如下: ”wrap”>正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当...

    CSS对表格单元格强制换行和不换行

     用CSS实现Table单元格数据自动换行或不换行的实现方法:  1、强制换行: <style type=text/css>.AutoNewline{ word-break: break-all;/*必须*/}</style><table><tr> 自动换行自动换行自动换行自动...

    css 解决英文字符与阿位伯数字自动换行

    break-word:它主要用来是控制是否将强制把单词换行,对于中英中文没有任何问题,但是对于长串的英文无效。 normal:英文单词不被拆开,它是默认值。 break-all,主要解决了长串英文的问题。主要用来是断开单词。在...

    css控制文字自动换行的实现方法

    自动换行问题,正常字符的换行是比较合理的,而连续的数字和英文字符常常将容器撑大,挺让人头疼,下面介绍的是CSS如何实现换行的方法 对于div,p等块级元素 正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-...

    CSS解决无空格的字母、数字过长不自动换行的问题

    默认情况下,一个 DIV或者其他元素的文本,如果都是无文字分隔符,无空格,则不会自动换行,比如: 复制代码代码如下: ”detail_title” xss=removed>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa

Global site tag (gtag.js) - Google Analytics