HTML页面table中文字不以省略号显示

今天在弄让标签中多余的文字以省略号显示时，遇到一个有意思的问题，道友请看。

代码

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title></title> <style>table{table-layout: fixed;/*这个属性的默认值是：auto，表示表格的宽高会随着内容的改变而改变*/}.tt1{width:150px;white-space:nowrap; /*对于长的字符不进行换行*/text-overflow:ellipsis;/*过长的字符会以省略号显示*/overflow:hidden;/*超过长度的内容会自动隐藏*/}  </style></head><body><table><tr><td class='tt1'>dsandkjsdsandkjsadddddsankdsajdklsajdlsadsadsandkjsdsandkjsadddddsankdsajdklsajdlsadsadsandkjsdsandkjsadddddsankdsajdklsajdlsadsadsandkjsdsandkjsadddddsankdsajdklsajdlsadsadsandkjsdsandkjsadddddsankdsajdklsajdlsadsa</td></tr></table><div class='tt1'>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaabbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</div><hr/></body>
</html>

现象

发蒙

两个标签引用的是同一个class，但是一个显示一个不显示。感觉一脸懵，希望各位道友指点指点，在下感激不尽。

HTML页面table中文字不以省略号显示相关推荐

使用VUE实现在table中文字信息超过5个隐藏，鼠标移到时弹窗显示全部
使用VUE实现在table中文字信息超过5个隐藏,鼠标移到时弹窗显示全部 <template> <div> <table> <tr v-for="i ...
CSS文字超出部分省略号显示
文章目录[隐藏] CSS 文字超出部分省略号显示前言 CSS 文字超出部分省略号显示实现方法 CSS 文字超出部分省略号显示实现效果 CSS 文字超出部分省略号显示前言在我们开发过程中,其实有这样的 ...
css中text文字超出宽度省略号显示并鼠标悬停显示剩余全部：
代码:记得写在渲染文字的那个标签class上: display: -webkit-box;overflow: hidden;text-overflow: ellipsis;word-wrap: bre ...
【CSS】使HTML页面表格中文字水平且垂直居中的方法（易错）
问题出现因为是td直接写的文字,并不是套了标签才写,水平居中很清楚就是text-aline: center; 但是垂直居中始终没有得到很好地解决,查找了网上的样式是vertical-align: m ...
html字体超出后隐藏省略号,CSS控制文字超出部分省略号显示
一:单行文本显示不完时,我们只需要设置单行文本的宽度,不允许换行,溢出隐藏及换行省略四个属性即可: p{ max-width: 100px; overflow:hidden; text-overflo ...
CSS让文字超过部分省略号显示
white-space: nowrap; //文本强制不换行text-overflow: ellipsis; //文本溢出显示省略号overflow: hidden; //溢出的部分隐藏max-hei ...
css单行，多行文字超出部分省略号显示
单行文字: white-space: nowrap;overflow: hidden;text-overflow:ellipsis; 多行文字: overflow-wrap: break-word;/ ...
CSS单行文字和多行文字超出部分省略号显示
单行 .text{width: 400rpx;overflow: hidden; /*隐藏*/white-space: nowrap; /*不换行*/text-overflow: ellipsis; ...
文字超出部分省略号显示
一.汉字 overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 1; -webkit-bo ...

HTML页面table中文字不以省略号显示

代码

现象

发蒙

HTML页面table中文字不以省略号显示相关推荐

最新文章

热门文章