写页面的时候遇到了一个小小的问题，如何让div中一行超链接文字只显示一行，多余的文字隐藏并加上省略号，悬浮时隐藏的文字显示出来？解决问题时发现了css3的一个新标签  text-overflow  ，其属性规定当文本溢出包含元素时发生的事情。语法如下：

  text-overflow: clip|ellipsis|string;
　　
  代码如下：

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>demo</title>
<style>
div{
white-space: nowrap;   //规定段落中的文本不进行换行
text-overflow:ellipsis;
overflow:hidden;
}
div:hover{
overflow: visible;
font-weight: bold;
}
</style>
</head>
<body>
<div style="width:100px;border:1px solid red;">
<a href="#">文本文本文本文本文本文本文本</a>
</div>
</body>
</html>

如何让div中的文字只显示一行，多余的文字隐藏并加上省略号（超链接形式）的更多相关文章

  1. CSS控制文字只显示一行 超出部分显示省略号

         <p style="width: 120px; height: 50px; border: 1px solid blue; white-space: nowrap; over ...

  2. CSS控制文字只显示一行，超出部分显示省略号

    <p style="width: 300px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;"&g ...

  3. HTML+css 文字只显示一行

    电脑端 设置行高,超出隐藏 p{ width: 80%; height: 16px; line-height: 16px; display: block; overflow: hidden; text ...

  4. JS控制文字只显示两行，超出部分显示省略号

    由于使用css控制文字只显示多行,超出部分显示省略号,存在一定的兼容性问题,所以总结了一下网上一些大咖使用js实现控制行数的解决方案. 第一步:依次引入jquery.js+jquery.ellipsi ...

  5. ScrollView中嵌套GridView，ListView只显示一行的解决办法

    转载:http://blog.csdn.net/luohai859/article/details/39347583 关于为什么只显示一行,个人理解是:如果单独使用GridView和ListView, ...

  6. RecyclerView, ListView 只显示一行内容 问题解决

    Adapter 中的data有多行,但是RecyclerView只显示一行. 原因出在item的layout xml, 用了自动生成的RelativeLayout, 她的默认高度height属性是ma ...

  7. ScrollView嵌套ListView只显示一行

    错误描述 ScrollView嵌套ListView中导致ListView高度计算不正确,只显示一行. 解决方法 重写ListView的onMeasure方法,代码如下. @Override publi ...

  8. NestedScrollView嵌套ListView时只显示一行的解决方法

    在使用CoordinatorLayout和AppBarLayout实现嵌套滑动的时候,出现listview没有嵌套滑动: 如果要实现嵌套滑动,则需要添加NestedScrollView,但是结果发现l ...

  9. ScrollView嵌套ListView只显示一行之计算的高度不正确的解决办法(转)

    ScrollView嵌套ListView只显示一行之计算的高度不正确的解决办法 分类: android应用开发2013-12-19 09:40 1045人阅读 评论(3) 收藏 举报 AndroidS ...

随机推荐

  1. 【莫队】bzoj4542: [Hnoi2016]大数

    挺有意思的,可以仔细体味一下的题:看白了就是莫队板子. Description 小 B 有一个很大的数 S,长度达到了 N 位:这个数可以看成是一个串,它可能有前导 0,例如00009312345.小 ...

  2. Mycat高可用解决方案二（主从复制）

    Mycat高可用解决方案二(主从复制) 系统部署规划 名称 IP 主机名称 用户名/密码 配置 mysql主节点 192.168.199.110 mysql-01 root/hadoop 2核/2G ...

  3. 一个4年工作经验的java程序员的困惑,怎样才能能为一个架构师,请教大神

    一个4年工作经验的java程序员的困惑,怎样才能能为一个架构师 LZ本人想往架构师发展, 业余时间也会看一些书籍, 但是感觉没有头绪, 有些书看了,也没有地方实践 我做了4年的java开发, 在一个公 ...

  4. c# 输出不同时间的格式

    C#时间/日期格式大全,C#时间/日期函数大全 有时候我们要对时间进行转换,达到不同的显示效果 默认格式为:2005-6-6 14:33:34 如果要换成成200506,06-2005,2005-6- ...

  5. python3.7 文件操作

    #!/usr/bin/env python __author__ = "lrtao2010" #python3.7 文件操作 # r 只读,默认打开方式,当文件不存在时会报错 # ...

  6. win7 命令提示符怎么以管理员方式打开

    点击屏幕最左下角的"开始"按钮,选择"运行"命令: 在弹出的"运行"对话框中输入"CMD"命令,再单击"确定& ...

  7. 【原创】Mysql中事务ACID实现原理

    引言 照例,我们先来一个场景~ 面试官:"知道事务的四大特性么?" 你:"懂,ACID嘛,原子性(Atomicity).一致性(Consistency).隔离性(Isol ...

  8. 【MySQL】MySQL备份和恢复

    一.为什么要备份数据 在生产环境中我们数据库可能会遭遇各种各样的不测从而导致数据丢失, 大概分为以下几种. 硬件故障 软件故障 自然灾害 黑客攻击 误操作 (占比最大) 所以, 为了在数据丢失之后能够 ...

  9. LoadRunner11使用方法以及注意点收集

    一:安装loadrunner http://jingyan.baidu.com/article/f7ff0bfc1cc82c2e26bb13b7.html http://www.cnblogs.com ...

  10. 遍历Request.QueryString

    Request.QueryString 返回的是 NameValueCollection, 而NameValueCollection实现了IEnumerable的GetEnumerator方法,只是G ...