写页面的时候遇到了一个小小的问题，如何让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. Matlab学习记录(函数)

    Matlab中的内建函数 Matlab自定义函数 用function构造函数 用inline构造函数 用syms构造符号函数 多项式相关函数 polyvalx convx 向量和矩阵运算函数 向量运算 ...

  2. Postman 没有走hosts文件

    问题: 在Windows10系统中,从官方下载Postman安装并登录后,创建一个请求并执行.但这个请求并没有走hosts文件中定义的192.168.33.10主机,而是走到了线上的主机. 分析: 通 ...

  3. 【Mysql】Mysql主从库搭建过程（爬完坑后整理所得）

    Mysql主从数据库搭建流程 新手开始学习mysql主从库,遇到一些问题,总结后写出以下流程 下面以5.7.23版本为例介绍 第一步:去官网下载5.7.23版本的免安装压缩包形式的mysql文件,贴上 ...

  4. release判断系统

    #!/bin/bash # Name: Atomic Archive configuration script # Copyright Atomicorp, 2002-2018 # License: ...

  5. mysql 的 case when 用法

    正确的格式: case when condition then result when condition then result when condition then result else re ...

  6. 天问之Linux内核中的不明白的地方

    1. Linux 0.11\linux\kernel\exit.c 文件中, 无论是send_sig()函数还是kill_session()函数中,凡是涉及到发送信号的地方,都是直接    (*p)- ...

  7. POJ：2411-Mondriaan's Dream（矩形拼接方案）

    题目链接:http://poj.org/problem?id=2411 解题心得: 可以说是很经典的一个状压dp了,写dfs遍历肯定是要超时的,这个题的状态转移方程对新手来说有点吃力. 状态转移用的是 ...

  8. poj 1979 走多少个‘ . '问题 dfs算法

    题意:给你一个迷宫地图,让你走.问最多可以走多少个“." 思路:dfs 找到起点,然后对起点进行dfs操作. dfs操作时,要把当前的位置标志成"#"表示已经走过,然后进 ...

  9. 如何锁定Android系统CPU的频率

    接触到了Android系统的Performance测试,所以有锁定CPU的需求: 由于要首先读取到此系统所支持的CPU频率,之后再所支持的频率中选取你想要的频率,之后进行锁定. 这个过程,手动也是可以 ...

  10. 【Shell】使用shell打印菜单，一键安装Web应用

    问题描述: [解答] [root@A04-Test- scripts]# more menu.sh #!/bin/bash echo "1.[install lamp]" echo ...