css td 溢出改为省略号

<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 溢出改为省略号的更多相关文章
- CSS 单行溢出文本显示省略号...的方法(兼容IE FF)(转)
http://www.52css.com/article.asp?id=602 =================================================== html ...
- 新公司入职第一天遇到的 关于 CSS 单行溢出文本显示省略号...的问题
上班第一天 前端岗位,因为公司这个项目是标准开发 所以没法用框架在打架页面,好吧 我手写 各种div 各种css样式 好不忧伤,好吧 不废话了 进入正题. 想在导航栏中的 客户信息 功能点 实现溢出用 ...
- css text-overflow溢出文本显示省略号
<div style="width: 100px; overflow: hidden; text-overflow:ellipsis"> <nobr>当对象 ...
- ant Table td 溢出隐藏(省略号)
1.创建组件 components/LineWrap/index.js /** * td 溢出隐藏 组件 */ import React, { PureComponent } from 'react' ...
- css文本溢出隐藏显示省略号(单行+多行)
文本超出若干行就换行,这个功能几乎每个文本浏览网站都会用到,实现它的办法也有很多,今天简单的介绍一下实现它的方法. 一. 单行文本不换行,并将超出文本隐藏 .box-content{ ove ...
- #CSS 文本溢出部分显示省略号
单行结尾溢出: 用text-overflow:ellipsis属性实现,当然还需要加宽度width属来兼容部分浏览. width:300px;overflow: hidden; text-overfl ...
- css 文字溢出隐藏 带省略号
.demo{ width:100px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } 注意宽度要设置
- (轉)CSS 单行溢出文本显示省略号...的方法(兼容IE FF)
轉自:http://www.cnblogs.com/hlz789456123/archive/2009/02/18/1392972.html html代码:<div><p>&l ...
- CSS文本溢出,显示省略号(...)
方式1:这种方式就是必须要跟width搭配使用,当你使用的display:flex; 的时候可能会影响样式 width: 200px; overflow: hidden; /*超出部分隐藏*/ tex ...
随机推荐
- linux内核I2C子系统学习(三)
写设备驱动: 四部曲: 构建i2c_driver 注册i2c_driver 构建i2c_client ( 第一种方法:注册字符设备驱动.第二种方法:通过板文件的i2c_board_info填充,然后注 ...
- NMM3DViewer 设计
在FrameworkInterfaces工程的INMM3DServer.cs中定义了 岩石材料结构 BlockMaterial -----> StrBLOCKProperty publ ...
- UVA - 1416 Warfare And Logistics (最短路)
Description The army of United Nations launched a new wave of air strikes on terroristforces. The ob ...
- FFmpeg for ios架构:中级
FFmpeg这部分想了非常久,也没找到比較好的解说方式.本来想像其他博客一样.对着代码一行行的分析.但后来感觉不太现实,FFmpeg应用在IOS上怎么说代码最少也有个5.6k行(包含音视频.业务逻辑) ...
- 关于 AlphaGo 论文的阅读笔记
这是Deepmind 公司在2016年1月28日Nature 杂志发表论文 <Mastering the game of Go with deep neural networks and tre ...
- HDU 3435A new Graph Game(网络流之最小费用流)
题目地址:HDU 3435 这题刚上来一看,感觉毫无头绪. .再细致想想.. 发现跟我做的前两道费用流的题是差点儿相同的. 能够往那上面转换. 建图基本差点儿相同.仅仅只是这里是无向图.建图依旧是拆点 ...
- gulp(基础篇)
今天在写项目的时候用到了gulp构建工具,虽然一年前就有用过,但是一直只存在于我的“有道云笔记”里,今天又一次用到,固然是巩固一下,这里来记录一下吧:这里我主要想要记录的就是初学者在第一次使用gulp ...
- 对OpenCV中Haar特征CvHaarClassifierCascade等结构理解
首先说一下这个级联分类器,OpenCV中级联分类器是根据VJ 04年的那篇论文(Robust Real-Time Face Detection)编写的,查看那篇论文,知道构建分类器的步骤如下: 1.根 ...
- python--面向对象封装
from collectoins import namedtuple Point=namedtuple('point',['x','y']) t1=Point(1,2) print(t1.x) pri ...
- java stoi
package string.string1_4; import java.util.Scanner; public class StrToInt { /** * 将str转换为int整数 * 1. ...