默认超过指定长度以...显示, 鼠标放到文本上显示全

代码如下

    .fh{

        max-width:220px;

        word-wrap:break-word;

        text-overflow:ellipsis;

        white-space:nowrap;

        overflow:hidden;

    }

    .fh:hover {

        white-space: normal;

        overflow: auto;

    }

class加上fh即可

 
 分类: 日常总结

表格的td行利用css显示...的更多相关文章

  1. table表格的td行利用css显示...

      默认超过指定长度以...显示, 鼠标放到文本上显示全 代码如下 .fh{ max-width:220px; word-wrap:break-word; text-overflow:ellipsis ...

  2. js控制表格单双行颜色交替显示

    <script language="JavaScript"> window.onload = function() { var Table=document.getEl ...

  3. 鼠标移动到表格的TD上的时候显示成一个手型的样子怎么做?

    在除了IE6的情况下,可以通过CSS的:hover伪类来实现: 假如你想设定的固定区域为: <div id="test"></div>,那么只需要在CSS样 ...

  4. JS实战 · 表格行颜色间隔显示，并在鼠标指定行上高亮显示

    思路: 1.获取所有行对象,将需要间隔颜色显示的行对象进行动态的className属性指定:      前提是:先定义好类选择器,就是说给行对象赋予name. 2.高亮用到两个事件:onmouseov ...

  5. 如何利用CSS代码使图片和文字在同一行显示且对齐

    对于初学css的新手朋友来说,经常会遇到这样一个问题,当文字和图片出现在同一行或者同一个div里面的时候,在浏览器中运行出来的显示效果往往是在不同的行,那么,我们怎么才能利用CSS代码使图片和文字在同 ...

  6. 表格td内容超出宽度显示... table-layout: fixed;

    td宽度用百分比固定好的时候,即使设置了 white-space:nowrap;/*文本不会换行,在同一行显示*/ overflow:hidden;超出隐藏 text-overflow:ellipsi ...

  7. CSS实现多行文字限制显示

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name ...

  8. css实现多行文字限制显示&编译失效解决方案

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name ...

  9. python全栈开发 * 表格标签 表单标签 css 引入方式 * 180807

    html部分 一.表格标签<table> 1.一个表格<table>由每行<tr>组成的,每行是由<td>组成的. 注意: 一个表格是由行组成的(行是由 ...

随机推荐

  1. Redis集群安装详细步骤

    环境: Centos7    redis3.0 三台虚拟机主机名分别为 master   node1  node2 如果单机的时候设置过密码最好把密码去掉,避免位置的错误. 拍个快照方便恢复. 1.创 ...

  2. 前端开发Grunt工具的安装使用

    随着前端开发效果越来越丰富,前端的结构也越来越复杂,这个时候就需要一个工具来进行管理,可以帮你做语法校验,文件拼接,代码压缩,文件清理等等琐事,Grunt就是这么一个不错的工具. 安装并不复杂,只要先 ...

  3. Java基础复习(六)

    1. 接口的实现类中的实现接口中的抽象方法的方法必须为public,为什么? 接口中所有的方法与变量都默认是 public 的,在接口中可以不写出来.但在实现类中,如果不明写的话,就变成了 frien ...

  4. 各种字体.效果和名字对应图. --- by 王朋

    原帖地址:http://www.oschina.net/question/565065_76244

  5. KubeSphere单节点(all-in-one)平台搭建记录

    KubeSphere单节点(all-in-one)平台搭建记录 目录 KubeSphere单节点(all-in-one)平台搭建记录 一.主机准备 1.1 主机配置 1.2 环境准备 二.下载kube ...

  6. Dockerfile镜像实例

    Dockerfile镜像实例 目录 Dockerfile镜像实例 一.构建SSH镜像 1. 建立工作目录 2. 生成镜像 3. 启动容器并修改root密码 二.systemctl镜像 1. 建立工作目 ...

  7. 统计学习：逻辑回归与交叉熵损失（Pytorch实现）

    1. Logistic 分布和对率回归 监督学习的模型可以是概率模型或非概率模型,由条件概率分布\(P(Y|\bm{X})\)或决 策函数(decision function)\(Y=f(\bm{X} ...

  8. JavaScript的原生Ajax解析

    通过JavaScript的Ajax进行详细的解析过程,从而更好的了解Jquery的Ajax. 顺带,我会在后面把我整理的一整套CSS3,PHP,MYSQL的开发的笔记打包放到百度云,有需要可以直接去百 ...

  9. Solution -「LOJ #141」回文子串 ||「模板」双向 PAM

    \(\mathcal{Description}\)   Link.   给定字符串 \(s\),处理 \(q\) 次操作: 在 \(s\) 前添加字符串: 在 \(s\) 后添加字符串: 求 \(s\ ...

  10. Solution -「CF 908G」New Year and Original Order

    \(\mathcal{Description}\)   Link.   对于 \(x\in\mathbb N^*\),令 \(s(x)\) 表示将 \(x\) 十进制下的各位数码排序后得到的十进制数的 ...