CSS控制文本自动换行的问题

用表格做网页排版的时候，一般都能正常使用。偏偏有时会碰到一段连续的英文词或者一堆感叹号(!!!)把网页就撑开的现象：（

总结了一下，只要在CSS中定义了如下句子，可保网页不会再被撑开了。

table{table-layout: fixed;}
td(word-break: break-all; word-wrap:break-word;)

注释一下：

1.第一条table{table-layout: fixed;}，此样式可以让表格中有!!!(感叹号)之类的字符时自动换行。

2.td{word-break: break-all}，一般用这句这OK了，但在有些特殊情况下还是会撑开，因此需要再加上后面一句(word-wrap:break-word;)就可以解决。此样式可以让表格中的一些连续的英文单词自动换行。

赞 (0)

相关推荐

  • ASP.NET Datagridview自动换行的小例子

    复制代码 代码如下: protected void AxGridView1_RowDataBound(object sender, GridViewRowEventArgs e)    {        //设置所有列不允许换行        //AxGridView1.Attributes.Add("style", "word-break:keep-all;word-wrap:false");        //设置所有列自动换行        AxGridVie

  • javascript实现的一个自定义长度的文本自动换行的函数。

    很多朋友在制作网页过程中总是发现某些时候一些英文会把原来好好的表格撑开而导致变形,虽然可以使用style="table-layout:fixed;word-wrap:break-word;word-break:break-all" 来解决这个问题,但有些时候会导致内容显示不完整而被隐藏了起来,并没有做到自动换行的效果. 于是偶就想写一个这样的函数来修补这个缺陷,这个函数很简单,但这里只是提供一种思路来解决这个问题. function fnAddBr(id, iPerLineLen){.

  • print不自动换行，puts会自动换行第1/2页

    1.print不自动换行,puts会自动换行,一行不够写的话,可以加"\"进行连接 ruby 代码 puts 6/2 print 6/1 puts 'hello world' puts '我们都是'\ '中国人' 运行结果: ruby 代码 3 6hello world 我们都是中国人 2.==,eql?,equal? 区别 ==值相等 eql?值相等,类型相等 equal?值相等,内存地址相等 a=1 b=1.0 c=1.0 d=1.0 e=c puts(a==b)#值相等 puts

  • Eclipse 格式化代码时不换行与自动换行的实现方法

    1.preferences->Java->Code Style->Code Formatter->Show... ,打开之后,选择"Line Wrapping"选项卡,在"Maximun line width"指定大于多少列时换行. 2.还是在"Line Wrapping"选项卡中,能过选择"Line Wrapping policy"可以指定构造函数.方法体等的换行情况. 不过,SUN推荐的编码风格默认

  • 多浏览器支持CSS 容器内容超出(溢出)支持自动换行

    .linebr { clear: both; /* 清除左右浮动 */ width: 100px; /* 必须定义宽度 */ word-break: break-word; /* 文本行的任意字内断开 */ word-wrap: break-word; /* IE */ white-space: -moz-pre-wrap; /* Mozilla */ white-space: -hp-pre-wrap; /* HP printers */ white-space: -o-pre-wrap; /

  • Discuz 公告效果（自动换行，无间隙滚动）

    ul { padding-right: 0px; padding-left: 0px; padding-bottom: 0px; margin: 0px; padding-top: 0px } #announcement { width:100%; background:url(img/menu_bg.gif) repeat; overflow: hidden; } #announcement div { border: #e6e6e6 1px solid; padding:0px 10px 0

  • JavaMe开发绘制可自动换行文本

    JavaMe开发绘制可自动换行文本

    [问题描述] JavaMe Graphics类中的drawString不支持文本换行,这样绘制比较长的字符串时,文本被绘制在同一行,超过屏幕部分的字符串被截断了.如何使绘制的文本能自动换行呢? [分析] drawString无法实现自动换行,但可以实现文本绘制的定位.因此可考虑,将文本拆分为多个子串,再对子串进行绘制.拆分的策略如下: 1 遇到换行符,进行拆分: 2 当字符串长度大于设定的长度(一般为屏幕的宽度),进行拆分. [步骤] 1 定义一个String和String []对象: priv

  • javascript 一个自定义长度的文本自动换行的函数

    很多朋友在制作网页过程中总是发现某些时候一些英文会把原来好好的表格撑开而导致变形,虽然可以使用style="table-layout:fixed;word-wrap:break-word;word-break:break-all" 来解决这个问题,但有些时候会导致内容显示不完整而被隐藏了起来,并没有做到自动换行的效果. 于是偶就想写一个这样的函数来修补这个缺陷,这个函数很简单,但这里只是提供一种思路来解决这个问题. function fnAddBr(id, iPerLineLen){.

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

    复制代码 代码如下: irefox中连续英文字符如果要CSS控制强制换行,探索了N久,发现是实现不了的逼不得已的时候就用js脚本进行控制吧 英文字符自动换行,通过js脚本截断字符串,此方法通用ie6,ie7,firefox兼容解决办法 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd

  • Flex Label自动截取、自动换行代码

    复制代码 代码如下: label.maxDisplayedLines=0; // 默认多行显示,不截取 label.maxDisplayedLines=1; //任意整数,显示单行文本,自动截取(...) label.maxDisplayedLines=2; //撑满label,可多行,显示不了的截取(...)

随机推荐