用css解决table文字溢出控制td显示字数

用css解决table文字溢出控制td显示字数

场景:

用css解决table文字溢出控制td显示字数

最左边这栏我不行让他换行,怎么办呢?

下面是解决办法:

 

[plain] 
view plain
 copy

 

  1. table{  
  2.     width:100px;  
  3.     table-layout:fixed;/* 只有定义了表格的布局算法为fixed,下面td的定义才能起作用。 */  
  4. }  
  5. td{  
  6.     width:100%;  
  7.     word-break:keep-all;/* 不换行 */  
  8.     white-space:nowrap;/* 不换行 */  
  9.     overflow:hidden;/* 内容超出宽度时隐藏超出部分的内容 */  
  10.     text-overflow:ellipsis;/* 当对象内文本溢出时显示省略标记(…) ;需与overflow:hidden;一起使用*/  
  11. }  

参考:
http://www.52design.com/html/201007/design201071123721.shtml

现在:

用css解决table文字溢出控制td显示字数

转自:https://github.com/wusuopubupt https://blog.csdn.net/wusuopuBUPT/article/details/21729985

转载于:https://www.cnblogs.com/sharpest/p/8656351.html

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/101743.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 用js来实现那些数据结构06(队列)

    其实队列跟栈有很多相似的地方,包括其中的一些方法和使用方式,只是队列使用了与栈完全不同的原则,栈是后进先出原则,而队列是先进先出(FirstInFirstOut)。一、队列队列是一种特殊的线

    2022年3月25日
    36
  • JS中height、clientHeight、scrollHeight、offsetHeight区别

    JS中height、clientHeight、scrollHeight、offsetHeight区别我们来实现test中的onclick事件  functionjustAtest()    {       vartest= document.getElementById(“test”);       vartest2=document.getElementById(“test2”)       vartest3=document.getElementB

    2022年7月23日
    15
  • RAID0、RAID1及RAID5的区别详解

    RAID0、RAID1及RAID5的区别详解目前已有的RAID(RedundantArrayofIndependentDisks,独立冗余磁盘阵列)技术有很多种,但是RAID0、RAID1、RAID5是最常见的几种方案。1、RAID0RAID0技术把多块(至少两块)物理硬盘设备通过软件或硬件的方式串联在一起,组成一个大的卷组,并将数据依次写入到各个物理硬盘中。这样,在最理想的情况下,硬盘设备的读写性能会提升数倍,但是若任意一…

    2022年7月25日
    20
  • 小学没跟上编程的步伐,长大了这样弥补,网友:一切都是为了生活「建议收藏」

    小学没跟上编程的步伐,长大了这样弥补,网友:一切都是为了生活「建议收藏」浙江省今年9月份开始的新学期,三到九年级信息技术课将同步替换新教材,其中,八年级将新增Python课程内容。新高一信息技术编程语言由VB替换为Python,大数据、人工智能、程序设计与算法等内容按照教材规划五六年级开始接触。随着我国北京、上海、广州、重庆、江苏等多地政策推广少儿编程教育的力度逐步增大,家长们愈发重视编程教育,一方面可以为高考选中的信息技术课程做铺垫,另一方面从小培养大数据意识。因为学习少儿编程除了帮孩子适应未来时代发展潮流,还可以培养孩子的抽象思考能力,帮助孩子训练整合信息、融汇贯通

    2022年5月16日
    45
  • QT6.1.2下载和安装教程

    QT6.1.2下载和安装教程QT6.1.2下载和安装教程Qt自从5.15版本开始,对非商业版本(开源版本)不提供已经制作好的离线exe安装包,QT6.1.2版本需要在线下载安装。参考链接:1-Qt6在线安装图文步骤文章目录下载安装用到的软件下载安装用到的软件一、下载QT软件在线下载器:1、国内清华大学开源软件镜像站下载 (推荐,网速快)https://mirrors.tuna.tsinghua.edu.cn/qt/official_releases/online_installers/2、Q.

    2022年5月16日
    43
  • subdiscipline_Sublime

    subdiscipline_Sublime部分转载自:使用sublime-snippet来快速做前端页面分析在sublime来中,可以通过submlime-snippet来快速补全代码。举个栗子,如果在sublime的存放submlime-snippet的文件夹下有如下的文件(elem-edge.sublime-snippet文件名不重要)ele

    2025年6月13日
    7

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号