<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

<script type="text/javascript"></script>

<style type="text/css">

.textoverflow a {

     display:block;

     width:120px;

     margin: 0px 0px 0px 3px;

     white-space: nowrap;

     overflow: hidden;

     float: left;

     -o-text-overflow: ellipsis;    /* for Opera */

     text-overflow: ellipsis;        /* for IE */

}

.textoverflow:after{

    content: "…";

}/* for Firefox */

@media all and (min-width: 0px){

    .textoverflow:after{

        content:"";

    }/* for Opera */

}

</style>

</head>

<body>

    <div class="textoverflow">

        <a> dfdlaiewuroiewqfjkdlsjfdksaifudsadfs</a>

    </div>

</body>

</html>

　　原文章:http://www.cnblogs.com/zfc2201/archive/2012/07/04/2575509.html

关注微信小程序  

css 文本超出范围显示省略号的更多相关文章

  1. CSS——文本超出隐藏显示省略号

    文本超出隐藏显示省略号 1.单行文本的溢出显示省略号 overflow: hidden; text-overflow:ellipsis; white-space: nowrap; // overflo ...

  2. css文本超出隐藏显示省略号

    p style="width: 300px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;"> 如 ...

  3. css文字超出自动显示省略号

    只针对单行文本有效: 01.针对块状元素 ul li{ width: 180px; text-overflow: ellipsis; white-space: nowrap;/*禁止自动换行*/ ov ...

  4. CSS文本溢出，显示省略号（...）

    方式1:这种方式就是必须要跟width搭配使用,当你使用的display:flex; 的时候可能会影响样式 width: 200px; overflow: hidden; /*超出部分隐藏*/ tex ...

  5. css兼容大部分浏览器的文本超出部分显示省略号

    css之字体多行省略(兼容大部分浏览器) 字体单行显示省略号 <style> .box1{ width: 500px; height: 1.5em; overflow: hidden; t ...

  6. CSS实现不换行/自动换行/文本超出隐藏显示省略号

    在写页面的时候,我们经常会需要用到关于文本的换行,强制换行以及显示几行超过显示省略号等,今天我们就对这些问题来做个汇总吧! 1.自动换行 div{ word-wrap:break-word; word ...

  7. css文本溢出隐藏显示省略号（单行+多行）

    文本超出若干行就换行,这个功能几乎每个文本浏览网站都会用到,实现它的办法也有很多,今天简单的介绍一下实现它的方法.  一. 单行文本不换行,并将超出文本隐藏 .box-content{     ove ...

  8. css/js 超出部分显示省略号

    1.js方法 function cutString(str, len) { //length属性读出来的汉字长度为1 if (str.length * 2 <= len) { return st ...

  9. CSS3文本超出容器显示省略号之text-overflow属性

    text-overflow:ellipsis; overflow:hidden; white-space:nowrap; 要想实现文本超出容器时显示省略号,上面3个属性必须同时搭配使用

随机推荐

  1. kafka消费者实时消费数据存入hdfs java scalca 代码

    hadoop-client依赖很乱 调试很多次cdh版本好多jar没有 用hadoop2.7.3可以 自定义输出流的池子进行流管理 public void writeLog2HDFS(String p ...

  2. 转——git常见使用命令及git原理

    0.常用命令1 1.git中brunch的使用和理解(一定理解brunch的指针理解和分叉) 分支创建 Git 是怎么创建新分支的呢? 很简单,它只是为你创建了一个可以移动的新的指针. 比如,创建一个 ...

  3. ethtools命令详解

    1 概述 ethtool 是用于查询及设置网卡参数的命令. 2 命令详解 2.1 命令格式 (1) 语法 ethtool [ -a | -c | -g | -i | -d | -k | -r | -S ...

  4. MyBatis进阶（二）

    MyBatis之动态SQL 动态SQL之foreach 有时SQL语句where条件是在一个集合或者数组里,需要使用in关键字,这时可以使用foreach动态SQL语句,例如: select * fr ...

  5. mysql常用的查询优化

    原文链接:https://www.jb51.net/article/39221.htm 1.对查询进行优化,应尽量避免全表扫描,首先应考虑在 where 及 order by 涉及的列上建立索引. 2 ...

  6. 微信小程序开发学习记录

    两天撸了一遍小程序的文档,跟网页相似,个人感觉是简化版.但是因为开放了很多微信自带的接口又使得部分功能开发起来相对方便 思维导图如下: 目前我的理解大概是这么个逻辑,以后深入学习后可能会有更改 跟着大 ...

  7. udp套接字及利用socketserver模块实现并发以及并发编程

    一:基于udp协议(数据报协议)的套接字:和tcp协议的套接字对比而言,由于udp是无链接的,所以先启动哪一端都不会报错,而且udp也不会有粘包 现象,所以对比下来,tcp协议的话传输数据更加可靠,但 ...

  8. HTML5的十大新特性

    为了更好地处理今天的互联网应用,HTML5添加了很多新元素及功能,比如: 图形的绘制,多媒体内容,更好的页面结构,更好的形式 处理,和几个api拖放元素,定位,包括网页 应用程序缓存,存储,网络工作者 ...

  9. Android 按钮响应事件的几种方式

    目录 1.在布局中指定onClick属性 2.使用匿名内部类 3.在当前Activity中实现OnClickListener接口 4.创建内部类 1.在布局中指定onClick属性 布局代码 < ...

  10. nodejs创建文件

    var fs = require('fs'); fs.writeFile(path + "test.txt", "hello world!", function ...