A JavaScript Fancier

伟大的javascript技术研究中...

  IT博客 :: 首页 :: 新随笔 :: 联系 :: 聚合  :: 管理 ::
  304 随笔 :: 0 文章 :: 479 评论 :: 0 Trackbacks


以前总结过Div的换行和不换行的css写法。但对于表格单元格只知道一个属性nowrap可以使其不换行。

近日有此需要,但发现加上nowrap在某些情况下还是会换行!无奈,没有一个强制不换行的方法吗?

baidu了一下,令俺非常欣慰,还真的找到了办法,问题解决了。

实现方法(原文copy过来):
=====================================
用CSS实现表格单元格数据自动换行或不换行

1、自动换行:
<style type="text/css">
.AutoNewline
{
  word-break
: break-all;/*必须*/
}
</style>

<table>
<tr>
  
<td class="AutoNewline">自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行</td>
</tr>
</table>

2、不换行:
<style type="text/css">
.NoNewline
{
word-break
: keep-all;/*必须*/
}
</style> 

<table>
<tr>
  
<td class="NoNewline">不换行不换行不换行不换行不换行不换行不换行不换行不换行不换行</td>
</tr>
</table>

posted on 2008-04-30 00:17 Yemoo'S JS Blog 阅读(2730) 评论(3)  编辑 收藏 引用 所属分类: HTML/XHTML/CSS

评论

# re: CSS实现表格单元格强制换行和强制不换行 2008-05-06 10:27 Handan
怎么使用JavaScript控制换行不换行那!
我使用了

element.class = "nonewline";
怎么也不行  回复  更多评论
  

# re: CSS实现表格单元格强制换行和强制不换行 2008-05-15 11:57 Yemoo'S JS Blog
element.className = "nonewline";
  回复  更多评论
  

# re: CSS实现表格单元格强制换行和强制不换行 2008-05-22 10:14 ie only
Firefox下无效  回复  更多评论
  

只有注册用户登录后才能发表评论。