当前博客:如何在表格内实现超出文字溢出隐藏并显示省略号,鼠标放在省略号上显示全部文本

82 次浏览【转载需注明来源】

博客作者:【临界点】

个性签名:寒窗苦读十年一朝凤舞九天

如何在表格内实现超出文字溢出隐藏并显示省略号,鼠标放在省略号上显示全部文本

        <区块 类名="表格居中">
            我头部
        </区块>
        <表格 类名="lay-表格 表格居中">  
        <表格格式列组>
            <表格格式列组值 行内样式="宽度: 400px;" />
            <表格格式列组值 行内样式="宽度: 100px;" />
            <表格格式列组值 行内样式="宽度: 300px;" />
        </表格格式列组>
          <表格头组>  
            <表格行>  
              <表格头>列1</表格头>  
              <表格头>列2</表格头>  
              <表格头>列3</表格头>  
            </表格行>  
          </表格头组>  
          <表格内容组>  
            <表格行>  
              <表格内容>超长文字1</表格内容>  
              <表格内容>我是一个超长文本此处省略一个字</表格内容>  
              <表格内容>超长文字3</表格内容>  
            </表格行>  
          </表格内容组>  
        </表格>

        <样式>
        .表格居中{
            宽度: 800px;
            外边距: 0px 自动;
        }

        表格内容 {  
              背景-颜色: 颜色值-粉色;
              溢出: 隐藏; /* 隐藏溢出的文字 */  
              文本-溢出: 省略号; /* 显示省略号 */  
              空格: 不换行; /*防止文字换行  */ 
            }
        </样式>
默认排序
Generic placeholder image
Generic placeholder image
qiang Time: 2023-12-07 09:51:58

建议给 表格 设置样式 表格-布局: 固定;。

.表格居中 {
    宽度: 800px;
    外边距: 0px 自动;
    表格-布局: 固定;
}

如何在表格内实现超出文字溢出隐藏并显示省略号,鼠标放在省略号上显示全部文本