样式:

{width: 160px; overflow: hidden; text-overflow:ellipsis; white-space: nowrap;}

说明:

white-space: nowrap 保证文本内容不会自动换行,如果多余的内容会在水平方向撑破单元格。

overflow: hidden 隐藏超出单元格的部分。

text-overflow: ellipsis 将被隐藏的那部分用省略号代替。

CSS实现内容超过长度后以省略号显示的更多相关文章

  1. css实现超出一行后用省略号显示

    css实现超出一行后用省略号显示 a{display:inline-block; text-overflow:ellipsis; white-space:nowrap; overflow:hidden ...

  2. android开发之当设置textview多少字后以省略号显示。限制TextView的字数

    设置多少字后以省略号显示 <TextView    android:id="@+id/tv"   android:layout_width="wrap_conten ...

  3. js和css实现内容超过边框,就自动省略,自动添加title

    在项目汇总,我们有这样的需求,如果内容多了,就自动省略,自动添加title 这个需要判断判断俩个值,一个是width(),一个是scrollWidth, 在div中,如果内容没有超过边框,这俩个值是一 ...

  4. 微信小程序文字超过行后隐藏并且显示省略号

    在小程序开发过程中,经常会遇到一些数据无法在text中完全展示,所以会使用到隐藏相关文字,并在后方加上省略号(...). 只需要在对应的text中设置下面的css就可以了. overflow:hidd ...

  5. 常用css样式(文字超出部分用省略号显示、鼠标经过图片放大、出现阴影)

    文字超出部分用省略号显示: white-space: nowrap; /* 不换行 */ overflow: hidden; /* 超出部分不显示 */ text-overflow: ellipsis ...

  6. table中超过长度的列,显示省略号

    <style type="text/css"> .table-ellipsis { table-layout: fixed; width: 100%; } .table ...

  7. css 文本超出容器长度后自动省略的方法!

    我们在给用户显示文本内容的时候,往往需要避免文本内容超出容器宽度,防止换行溢出,小弟在网上找了下发现网上的实现仅仅只是实现了用 ...省略了的功能! 而并没有获取光标提示的功能,所有小弟就结合网上的代 ...

  8. CSS文字超出指定长度,用省略号

    overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display: block;

  9. css 文本显示多行后用省略号显示剩余的

    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; overflow: hidden;      

随机推荐

  1. js ajax php分页组件

    github  https://github.com/lihefen/pageList html页面 <!DOCTYPE html><html><head>< ...

  2. 通过easyui tab添加的子页面JS脚本必须放在body才生效

    通过easyui tab添加的子页面JS脚本必须放在body才生效 可通过Chrome查看元素时,head标签是否含有你自己写的JS代码

  3. 5.SVM核函数

    核函数(Kernels) 定义 1.1 (核或正定核) 设是中的一个子集,称定义在上的函数是核函数,如果存在一个从到Hilbert空间的映射 使得对任意的,都成立.其中表示Hilbert空间中的内积. ...

  4. jQuery:实现网页的打印功能

    实现的打印功能大致跟浏览器的 Ctrl+P 效果一样 一.直接上代码 <!DOCTYPE html> <head> <meta charset="utf-8&q ...

  5. 没有神话,聊聊decimal的“障眼法”

    0x00 前言 在上一篇文章<妥协与取舍,解构C#中的小数运算>的留言区域有很多朋友都不约而同的说道了C#中的decimal类型.事实上之前的那篇文章的立意主要在于聊聊使用二进制的计算机是 ...

  6. Event Sourcing Pattern 事件源模式

    Use an append-only store to record the full series of events that describe actions taken on data in ...

  7. HTML5 网络拓扑图整合 OpenLayers 实现 GIS 地图应用

    在前面<百度地图.ECharts整合HT for Web网络拓扑图应用>我们有介绍百度地图和 HT for Web 的整合,我们今天来谈谈 OpenLayers 和 HT for Web  ...

  8. ES6笔记(5)-- Generator生成器函数

    系列文章 -- ES6笔记系列 接触过Ajax请求的会遇到过异步调用的问题,为了保证调用顺序的正确性,一般我们会在回调函数中调用,也有用到一些新的解决方案如Promise相关的技术. 在异步编程中,还 ...

  9. form表单的字符串进行utf-8编码

    <form>表单有assept-charset属性.该属性规定字符的编码方式,默认是"unknown",与文档的字符集相同. 该属性除了Internet explore ...

  10. 在浏览器标签显示网站logo图标

    在网站根目录下添加favicon.ico文件,并在网页添加如下代码: <link rel="bookmark" href="~/favicon.ico" ...