td隐藏多余文本 - - ITeye博客

`

西门吹牛

浏览: 227250 次
性别:
来自: 天津

最近访客更多访客>>

liuyao520830

fxstiandi

5180466

392091

博主相关

博客

微博

相册

收藏

留言

关于我

文章分类

社区版块

存档分类

最新评论

wang263574375：楼上的能不能配置一个简单的例子出来
spring mvc前台时间字符串到后台Date的转换
tss0823： ...
spring mvc前台时间字符串到后台Date的转换
贝特虫子：管用，谢谢！
oracle行转列
songlingjie：不错，受用了，也是初学，赞一个
一篇很全面的freemarker教程
zjfshowtime：是篇好文章，按照文章做了很多demo，学到了很多东西，子这里谢 ...
一篇很全面的freemarker教程

td隐藏多余文本

博客分类：

前端

Firefox XHTML HTML

阅读更多

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<style>
table{ table-layout:fixed;}
td{text-overflow:ellipsis;overflow: hidden;white-space:nowrap;word-break:keep-all; }
td:after{ content:"***";}/* firefox下有效*/
</style>
</head>

<body>
<table id="query"  class="ht_tab1" width="100%" cellspacing="0" cellpadding="0" border="1">



	<tr>
		<td width="5%"  title="xxx" >ererwaasdasd</td>
		<td width="95%" title="yyy" >用户IDasdasdasdasdasdasd</td>
	
	</tr>
</table>
<div style="width:200px;text-overflow:ellipsis;overflow: hidden;white-space:nowrap; background-color:#00CC99;">这里是一个测试这里是一个测试这里是一个测试这里是一个测试</div>

</body>
</html>

分享到：

W3C基于css选取语法的DOM元素获取api | 分析及开窗函数

2010-06-21 15:53
浏览 2148
评论(0)
分类:Web前端
查看更多

评论

发表评论

您还没有登录,请您登录后再发表评论

相关推荐

解决layui表格内文本超出隐藏的问题: 通常情况下，Layui表格的默认样式会使得超出文本部分隐藏，如果需要显示超出的文本，需要调整对应的CSS样式。这里提供了一种方法，即通过修改`.layui-table-cell`类的样式属性来实现文本的完整显示。 `.layui-table...

CSS文本超出指定宽度后隐藏并显示为省略号的实现方法: 综上所述，通过设置 `text-overflow`、`overflow` 和 `white-space` 属性的组合，我们可以控制CSS中文本溢出的显示方式，使内容在超出指定宽度后能够隐藏多余部分，并用省略号来提示用户还有更多内容。这在进行Web...

vue控制多行文字展开收起的实现示例: 在这个例子中，设置了3行的限制，当内容超过3行时，超出部分将被隐藏。同时，通过`display: -webkit-box`和`-webkit-box-orient: vertical`使文本块成为一个竖向的盒模型，以便 `-webkit-line-clamp` 能正常工作。`...

java项目学习笔记: <tr><td>需要隐藏的行</td> ``` 以上是基于HTML、CSS和JavaScript的基本操作，通过这些技术点的学习，可以在Web开发中更好地处理用户界面和交互逻辑。这些技巧不仅适用于Java项目，也适用于其他任何Web开发...

layui表格内容溢出的解决方法: 3. 上述样式配合，使得文本内容超出指定宽度时，自动隐藏多余的文本，并以省略号显示。在HTML结构上，具体的实现方式如下： ```html 序号文章标题文章内容发布时间发布人操作 ${...

css表格单元格中的长文本如何实现自动换行: 对于表格的特殊情况，可以通过设置`table-layout`属性为`fixed`来强制表格的宽度，多余的内容将被隐藏。此外，内层的`td`或`th`元素可以采用上述的`word-break: break-all;`或`word-wrap: break-word;`来处理换行。...

css之自动换行.pdf: `配合`word-break`或`word-wrap`来控制内容换行和隐藏多余内容。例如： ```html <td>abcdefghigklmnopqrstuvwxyz1234567890ssssssssssssss</td> ``` Firefox浏览器则需要同时使用`table-layout: fixed;`、`...

Web前端开发技术-操作元素.pptx: - `innerText`: 它用于设置或获取元素的纯文本内容，会去除HTML标签并处理多余的空格和换行。例如，`element.innerText = '新文本'`将仅替换元素内的文本，不包含任何HTML。 - `textContent`: 此属性用于设置或...

对于div,p等块级元素css如何实现自动换行: 来强制固定宽度，多余内容使用隐藏或滚动条进行处理。 5. 对于td或th元素内的div、p等块级元素，仍然可以使用上述方法来实现自动换行。需要注意的是，上述提到的CSS属性和方法在不同浏览器中的支持程度可能有所...

用CSS控制表格或单元格强制换行,防止表格被英文单词或中文撑大: `并指定表格宽度，多余内容会被隐藏： ```html <td>abcdefghigklmnopqrstuvwxyz1234567890ssssssssssssss</td> ``` 2. 同样在IE浏览器中，我们可以为`td`或`th`设置`word-break: break-all;`或`word-wrap: ...

css控制文字自动换行的实现方法: `属性来强制表格的宽度，同时隐藏超出指定宽度的多余内容。而Firefox浏览器则需要在`<td>`和`<th>`元素内使用`word-break:break-all;`或`word-wrap:break-word;`属性来实现换行，如果要隐藏超出的内容，则可以使用`...

freemarker总结: <tr><td>${being.name}<td>${being.price} Euros </table> 输出为： <p>We have these animals: <tr><th>Name<th>Price <tr><td>mouse<td>50 Euros <tr><td>elephant<td>5000 Euros <tr>...

css实现连续的英文或数字自动换行的方法: 这样可以确保内容不会影响整体布局，但这种方法并不能真正实现换行，只是隐藏了多余的内容。例如： ```css .tb { table-layout: fixed; } .td { overflow: hidden; } ``` 在表格的TD中使用`nowrap`样式，同时给...

EasyUI的doCellTip实现鼠标放到单元格上提示单元格内容: 1. 定义显示提示框的函数showTip，它会根据鼠标所在的单元格（td）获取文本内容，并在页面上创建一个div元素作为提示框，显示相应的文本信息。 2. 使用jq.each遍历每一个数据网格（datagrid）元素，对其绑定事件和...

关于table表格中的内容溢出布局方法: 内容溢出是指当元素的内容超过了其指定的宽度或高度时，多余的内容会被隐藏，而不是直接显示出来。在CSS中，我们可以通过一些特定的属性来处理这种情况。 1. `white-space: nowrap`: 这个属性强制文本在同一行显示...

Global site tag (gtag.js) - Google Analytics