<!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. linux 安装nginx+php+mysql

    http://www.cnblogs.com/kyuang/p/6801942.htmlnginx安装 本文是介绍使用源码编译安装,包括具体的编译参数信息. 正式开始前,编译环境gcc g++ 开发库 ...

  2. Linux下执行Oracle的sql脚本

    (1)  启动监听: Root用户登录后,输入: $su – oracle 回车(Oracle为Oracle数据库安装用户,必须有横杠: - ) 启动监听: $lsnrctl start --启动 $ ...

  3. 搭建Elasticsearch平台

    https://cloud.tencent.com/developer/article/1189282 https://blog.csdn.net/qq_34021712/article/detail ...

  4. yum downloadonly模式，保存所需软件及其依赖包

    command: sudo yum install --downloadonly --downloaddir='yourderictory'

  5. pixi.js(入门)

    1.关于 一个关于HTML5 2D渲染引擎,它的独特之处在于其拥有了canvas回调功能的WebGL,速度快,能够兼容所有设备,简单得说也就是跨平台了,我用的开发工具是WebStorm 2.参考API ...

  6. loadrunner中web_reg_save_param和web_reg_save_param_ex的区别

    在使用Loadrunner进行性能测试,编写接口请求脚本时,通过会用到关联函数,而web_reg_save_param和web_reg_save_param_ex的函数有什么区别呢?以下为总结的两点, ...

  7. MySQL 5.6容器使用自定义配置文件的权限问题

    提出问题: 在使用Rancher2.0.2部署一个mysql deployment时,我们会发现,如果只设置/var/lib/mysql数据目录时,mysql容器(pod)能够正常启动,一旦数据目录和 ...

  8. Gson如何解析key值是数字的json数据

    1.使用注解@SerializedName来解决这个问题 2.比如有如下json数据:(key值是数字"1112") { "1112": "抖音&qu ...

  9. AngularJS服务及注入--Provider

    Provider简介 在AngularJS中,app中的大多数对象通过injector服务初始化和连接在一起. Injector创建两种类型的对象,service对象和特别对象. Service对象由 ...

  10. Practical Node.js (2018版) 第9章： 使用WebSocket建立实时程序，原生的WebSocket使用介绍，Socket.IO的基本使用介绍。

    Real-Time Apps with WebSocket, Socket.IO, and DerbyJS 实时程序的使用变得越来越广泛,如传统的交易,游戏,社交,开发工具DevOps tools, ...