写页面的时候遇到了一个小小的问题，如何让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. 【MySQL】mac环境下使用navicat premium连接mysql乱码问题

    ---恢复内容开始--- 最重要的两点:使用navicat premium创建mysql连接和在mysql连接里面创建数据库时,需要注意. 1.创建连接时,Encoding不需要手动选择,保持Auto ...

  2. PHP做ERP, CRM, CMS系统需要注意哪些地方

    php作为二次开发弱类型语言, 可读性, 可视度都是比较高的. 在很多人眼里, 也许php只能做一些web应用开发, 比如某个公司的网站, 某个公司的网站后台, 其实,我可以告诉大家, php不比任何 ...

  3. 图解Disruptor框架（二）：核心概念

    图解Disruptor框架(二):核心概念 概述 上一个章节简单的介绍了了下Disruptor,这节就是要好好的理清楚Disruptor中的核心的概念.并且会给出个HelloWorld的小例子. 在正 ...

  4. Python PyAudio 安装使用

    Python PyAudio安装: Python3.7 无法安装pyaudio pip install pyaudio提示error: Microsoft Visual C++ 14.0 is req ...

  5. SQL语句小练习

    一.创建如下表结构(t_book) Id         主键   自增一 bookName   可变长 20 Price   小数 Author    可变长20 bookTypeId    图书类 ...

  6. statistics-skewed data

    参考文献: http://www.statisticshowto.com/skewed-distribution/ left/negatively-skewed distributions : box ...

  7. ADT操作实例

    ps.1.put(rank,value) 把当前rank的元素的数值修改 2.get(rank)获取rank的元素 3.remove(value)把向量中value剔除掉 4.size()返回元素个数 ...

  8. Linux学习-延伸正则表达式

    grep 默认仅支持基础正则表达式,如果要使用延伸型正则 表达式,你可以使用 grep -E , 不过更建议直接使用 egrep !直接区分指令比较好记忆!其 实 egrep 与 grep -E 是类 ...

  9. 枚举进程——暴力搜索内存（Ring0）

    上面说过了隐藏进程,这篇博客我们就简单描述一下暴力搜索进程. 一个进程要运行,必然会加载到内存中,断链隐藏进程只是把EPROCESS从链表上摘除了,但它还是驻留在内存中的.这样我们就有了找到它的方法. ...

  10. adb提取安装的apk

    第一步:列出所有安装的apk adb shell pm list packages  然后找到自己要取出来的apk的包名. 第二布:找到apk的位置(后面跟上包名) adb shell pm path ...