<style>
.table{
table-layout: fixed;
width:100%;
}
.td{
width:100px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
        word-wrap: normal;
} table td { border:1px solid red; } </style>

第二种方式是用js直接截取字符串,在拼接三个点...;这样页面样式看上去也像是超出变成...

截取字符串的方法有很多钟,这里只举例一种:str=str.substring(0,i);  // 取字符串的前i个字符;

想要了解更多截取字符串方法,推荐一篇文章 https://www.cnblogs.com/cuixiaohua/p/7373171.html

备注: .table是整个表格的样式, .td是需要改变td长度溢出变省略号的样式。

css td 溢出改为省略号的更多相关文章

  1. CSS 单行溢出文本显示省略号...的方法(兼容IE FF)(转)

    http://www.52css.com/article.asp?id=602 ===================================================     html ...

  2. 新公司入职第一天遇到的 关于 CSS 单行溢出文本显示省略号...的问题

    上班第一天 前端岗位,因为公司这个项目是标准开发 所以没法用框架在打架页面,好吧 我手写 各种div 各种css样式 好不忧伤,好吧 不废话了 进入正题. 想在导航栏中的 客户信息 功能点 实现溢出用 ...

  3. css text-overflow溢出文本显示省略号

    <div style="width: 100px; overflow: hidden; text-overflow:ellipsis"> <nobr>当对象 ...

  4. ant Table td 溢出隐藏(省略号)

    1.创建组件 components/LineWrap/index.js /** * td 溢出隐藏 组件 */ import React, { PureComponent } from 'react' ...

  5. css文本溢出隐藏显示省略号(单行+多行)

    文本超出若干行就换行,这个功能几乎每个文本浏览网站都会用到,实现它的办法也有很多,今天简单的介绍一下实现它的方法.  一. 单行文本不换行,并将超出文本隐藏 .box-content{     ove ...

  6. #CSS 文本溢出部分显示省略号

    单行结尾溢出: 用text-overflow:ellipsis属性实现,当然还需要加宽度width属来兼容部分浏览. width:300px;overflow: hidden; text-overfl ...

  7. css 文字溢出隐藏 带省略号

    .demo{ width:100px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } 注意宽度要设置

  8. (轉)CSS 单行溢出文本显示省略号...的方法(兼容IE FF)

    轉自:http://www.cnblogs.com/hlz789456123/archive/2009/02/18/1392972.html html代码:<div><p>&l ...

  9. CSS文本溢出,显示省略号(...)

    方式1:这种方式就是必须要跟width搭配使用,当你使用的display:flex; 的时候可能会影响样式 width: 200px; overflow: hidden; /*超出部分隐藏*/ tex ...

随机推荐

  1. 猫猫学iOS之小知识之_xcode插件的删除方法_自己主动提示图片插件KSImageNamed有时不灵_分类或宏之类不能自己主动提示,

    猫猫分享,必须精品 原创文章.欢迎转载. 转载请注明:翟乃玉的博客 地址:http://blog.csdn.net/u013357243 一:解决解决自己主动提示图片插件KSImageNamed有时不 ...

  2. spring 拦截器拦截点的配置

    实用正则org.springframework.aop.support.RegexpMethodPointcutAdvisor 然后 <property name="advice&qu ...

  3. POJ 2249-Binomial Showdown(排列组合计数)

    Binomial Showdown Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 18457   Accepted: 563 ...

  4. 安装下载MySQL

    下载MySQL的地址:下面两个都行 http://dev.mysql.com/downloads/windows/ http://dev.mysql.com/downloads/installer/5 ...

  5. App性能优化浅谈

    前言 前段时间给公司的小伙伴们进行了关于app性能优化的技术分享.这里我稍微整理一下也给大家分享一下.关于性能优化这个话题非常大,涉及面能够非常广,也能够非常深入.本人能力有限,不会给大家讲特别难懂, ...

  6. caffe搭建----Visual Studio 2015+CUDA8.0+CUDNN5配置Caffe-windows(BLVC)

    原文来源:  来源:Angle_Cal  2016-12-19 17:32 本博主修改于2017-09-12.  版权所有,转载请注明出处.   BLVC版本的Caffe-windows已经支持Vis ...

  7. 搭建mysql主从集群的步骤

    前提条件是:须要在linux上安装4个mysql数据库,都须要配置完对应的信息. 须要搭建: mysql 01: 主数据库  master                  mysql 02 :   ...

  8. 三星note3 N900刷机包 4.4.2 ZSUDNE3 官方原汁原味 稳定流畅

    ROM介绍 此ROM基于最新的4.4.2 ZSUDNE3 制作,加入一些必要功能,其它性能基本与官方无差距,各方面感觉都非常不错了.此ROM本人自用,所以制作风格有点个人倾向.不论什么建议或者问题欢迎 ...

  9. Mvc之Ajax上传图片

    MyAjaxForm下载地址,点击此处下载 视图部分: @{ ViewBag.Title = "Index"; Layout = "~/Views/Shared/_Lay ...

  10. .Net——实现IConfigurationSectionHandler接口定义处理程序处理自定义节点

    除了使用.net里面提供的内置处理程序来处理我们的自定义节点外,我们还可以通过多种方法,来自己定义处理类处理我们的自定义节点,本文主要介绍通过实现IConfigurationSectionHandle ...