0 0

怎么判断文本内容会超出td?0

怎么判断文本内容会超出td?

我想实现一个功能,就是在"<td>...文本...</td>"中的文本超出td大小的时候,显示一段文本+"...",然后鼠标移动到td上时显示tip.
可是我怎么才能判断出来文本内容需要的大小超出了td的大小呢?
2013年5月06日 10:13

4个答案 按时间排序 按投票排序

1 0

从下面这个帖子学习如何获得字符串的宽度,
http://stackoverflow.com/questions/118241/calculate-text-width-with-javascript
然后td元素的宽度你肯定知道怎么做。

2013年5月06日 10:55
0 0

这个完全用css样式就可以控制了, td宽度指定的,当文本内容超出td宽度时会自动变成...的形式,也就是刚那位仁兄所说的css属性text-overflow :ellipsis

2013年5月08日 11:25
0 0

对,用CSS控制显示样式

2013年5月06日 14:06
0 0

css 属性 text-overflow :ellipsis
当对象内文本溢出时显示省略标记(...)

2013年5月06日 12:57

相关推荐

    文本控制器 编程软件 TD220 V8版

    **TD220文本控制器编程软件V8.0C详解** TD220文本控制器是专为实现设备与操作人员交互而设计的一款人机界面(HMI)产品,其V8.0C版本代表了该系列的一个重大更新,旨在提供更高效、功能更丰富的操作体验。在本文中...

    td单元格内容缩略显示问题

    当单元格(td)内的内容过多时,可能会导致布局混乱或者阅读不便。为了解决这个问题,我们可以采用“缩略显示”技术,使超出长度的内容以省略号(...)的形式呈现,同时保持整体布局的整洁和易读性。本文将详细探讨...

    css实现不再让内容把td撑开的常用解决方法

    在网页设计中,经常遇到一个问题,那就是表格中的单元格(td)会被其内部的内容自动撑开,导致表格的布局混乱。这种情况通常是由于内容长度超过了单元格的预设宽度,浏览器会默认扩展单元格来适应内容。然而,我们...

    table 中,如何使得单元格的内容不换行,单元格不被撑开,显示不下的时候在结尾处显示“...”

    然而,这种方式可能无法立即生效,因为默认情况下,`&lt;td&gt;`元素的宽度会根据内容自动调整。为了保持单元格的固定宽度,我们需要设置一个特定的宽度值,例如: ```css td { width: 150px; /* 设置单元格宽度,可根据...

    解决layui表格内文本超出隐藏的问题

    在Layui中,表格内文本超出隐藏的问题可以通过CSS样式控制来解决。通常情况下,Layui表格的默认样式会使得超出文本部分隐藏,如果需要显示超出的文本,需要调整对应的CSS样式。这里提供了一种方法,即通过修改`....

    CSS超出文本指定宽度用省略号代替和文本不换行

    CSS提供了多种方法来处理这种情况,尤其是当文本超出指定宽度时。本文将深入探讨如何使用CSS实现超出文本指定宽度用省略号代替以及禁止文本换行。 1. **一般文字截断** 当我们希望文本在特定宽度后被截断并用省略...

    将td中文字过长的部分变成省略号显示的小技巧

    在某些情况下,TD中的文字内容可能会超出单元格的实际显示范围,此时就需要对文字进行适当的处理,以保持页面布局的整洁性。本文将介绍如何使用CSS的几个关键属性,将TD中文字过长的部分变成省略号显示的小技巧。 ...

    html中的div、td 、p 等容器内强制换行和不换行的实现

    在HTML中,`div`、`td` 和 `p` 等元素作为常见的容器,经常用于组织和展示页面内容。对于这些容器内的文本换行处理,可以通过CSS样式来实现。这里我们将详细讨论如何实现强制不换行以及自动换行,并分析不同换行方式...

    表格里使用text-overflow后不能隐藏超出的文本的解决方法

    当你设置`text-overflow: ellipsis`时,文本超出容器边界的部分会被替换为省略号,表示内容被截断。而`clip`值则会简单地裁剪超出部分的文本,不留任何指示。 要使`text-overflow`正常工作,必须配合使用其他两个...

    table表格某一td内容太多导致样式混乱的解决方案

    问题的核心在于,当`td`内的文本或内容超出其默认宽度时,表格的布局会受到影响,原有的列宽不再适用,进而破坏整体的表格结构。这种情况尤其在内容长度不可预知或者需要显示长字符串时更为常见。 要解决这个问题,...

    通过CSS让TD自动换行

    这样,当td元素内的文本长度超过单元格的宽度时,文本会在任意字符处换行,确保内容不会溢出。 例如,在JavaScript动态创建元素或者Ajax应用中,我们可以为创建的td元素添加CSS样式来实现自动换行: ```html &lt;td ...

    CSS文本超出指定宽度后隐藏并显示为省略号的实现方法

    根据标题和描述,以及提供的部分内容,我们可以了解关于CSS文本超出指定宽度后隐藏并显示为省略号的实现方法,以及相关的知识点。以下详细说明: 1. CSS中实现文本溢出显示省略号的基本属性组合: - `text-...

    html小技巧之td,div标签里内容不换行

    `时,需要注意的是,如果内容确实过长,强制不换行可能会导致内容超出容器边界,从而影响页面的布局和美观。为了避免这种情况,可以适当调整容器的宽度或者通过添加滚动条的方式来处理过长的内容。 总结起来,在`...

    javascript 使td内容不换行不撑开

    设置为`hidden`时,超出的内容会被隐藏,而不是滚动或溢出到容器外。 3. `word-break`: 这个属性用于控制单词的断行规则。设置为`keep-all`时,单词不会在非空字符间断开,除非必要(例如,为了适应容器的宽度)。 ...

    CSS控制文本超出指定宽度显示省略号和文本不换行效果的实现

    在本篇文档中,我们将深入学习如何使用CSS控制文本的显示方式,具体来说是如何实现当文本超出指定宽度时,在文本的末尾显示省略号,并且文本不换行。这种效果在网页设计中非常常见,它能够帮助我们优雅地处理那些...

    layui表格内容溢出的解决方法

    这个属性用于设置溢出内容的处理方式,设置为隐藏后,内容超出DIV宽度时会被裁剪。 - white-space: nowrap; 此属性设置内容不换行。 - text-overflow: ellipsis; 当文本溢出包含元素时,此属性会截断文本并显示...

    网页制作 TD也可以溢出隐藏显示

    在网页制作过程中,经常会遇到如何处理超出表格单元格(TD)宽度的文本的问题。传统上,TD中的文本在超出单元格宽度时会自动换行显示。但有时候,我们需要的是文本溢出时隐藏而不是换行,即实现溢出隐藏(overflow: ...

Global site tag (gtag.js) - Google Analytics