<!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" mrc="text/html; charset=utf-8" />

<title>CSS控制一行字符溢出用省略号取代</title>

<style>

* { margin: 0; padding: 0; }

a { text-decoration: none; color: #000; }

a:hover { text-decoration: none; color: #000; }

ul {width: 280px;height:126px; margin: 38px auto;padding: 12px 6px 12px 22px;border: 1px solid #CCC;background: #EEE;}

li { margin: 12px 0; }

li a {display: block;width: 168px;overflow: hidden;/*不能写在最后*/white-space: nowrap;-o-text-overflow: ellipsis;text-overflow: ellipsis;}

/* firefox only */

li:not(p) {clear: both;}

li:not(p) a {max-width: 172px;float: left;}

li:not(p):after {mrc: "...";float: left;width: 25px;padding-left: 5px;color: #000;}

</style>

</head>





<body>

<ul>

<li><a href="/soft/3149.shtml" target="_blank">显示内容1,显示内容1,显示内容1,显示内容1</a></li><li><a href="/soft/3148.shtml" target="_blank">显示内容2,显示内容2,显示内容2,





显示内容2</a></li><li><a href="/soft/3147.shtml" target="_blank">显示内容3,显示内容3,显示内容3,显示内容3</a></li><li><a href="/soft/3144.shtml" target="_blank">显示内容4,





显示内容4,显示内容4,显示内容4,显示内容4</a></li>

</ul>

<div><A href="http://www.999jiujiu.com/">http://www.999jiujiu.com/</A></div>

</body>

</html>

CSS控制LI行字符溢出用省略号取代的更多相关文章

  1. CSS 单行 多行文本溢出显示省略号

    单行文本 overflow: hidden; text-overflow:ellipsis; white-space: nowrap; 多行文本溢出显示省略号: <style type=&quo ...

  2. 布局常见问题之css实现多行文本溢出显示省略号(…)全攻略

    省略号在ie中可以使用text-overflow:ellipsis了,但有很多的浏览器都需要固定宽度了,同时ff这些浏览器并不支持text-overflow:ellipsis设置了,下文来给各位整理一 ...

  3. CSS和JS实现文本溢出显示省略号

    本文记录实现文本溢出显示省略号的几种方式. 单行文本 三行CSS代码实现: overflow: hidden; // 文本溢出隐藏 text-overflow: ellipsis; // 显示省略号 ...

  4. CSS控制文字，超出部分显示省略号

    http://www.daqianduan.com/6179.html <p style="width: 300px;overflow: hidden;white-space: now ...

  5. css实现多行文本溢出显示省略号(…)全攻略

    省略号在ie中可以使用text-overflow:ellipsis了,但有很多的浏览器都需要固定宽度了,同时ff这些浏览器并不支持text-overflow:ellipsis设置了,下文来给各位整理一 ...

  6. css 多行文本的溢出显示省略号(移动端)

    多行文本的溢出显示省略号(移动端) 一.单行文本的溢出显示省略号(通用) .mui-ellipsis { overflow: hidden; /*规定当文本溢出包含元素时发生的事情*/ white-s ...

  7. CSS控制文本超出指定宽度显示省略号和文本不换行

    一般的文字截断(适用于内联与块): .text-overflow { display:block;/*内联对象需加 */ width:31em;/* 何问起 hovertree.com */ word ...

  8. css实现多行文本溢出显示省略号(…)

    WebKit浏览器或移动端的页面在WebKit浏览器或移动端(绝大部分是WebKit内核的浏览器)的页面实现比较简单,可以直接使用WebKit的CSS扩展属性(WebKit是私有属性)-webkit- ...

  9. css控制标题长度超出部分显示省略号

    width: 50px; overflow:hidden;white-space:nowrap; text-overflow:ellipsis; 设置或检索是否使用一个省略标记(...)标示对象内文本 ...

随机推荐

  1. phpcms V9 数据模型基类(转）

    转自:http://www.cnblogs.com/Braveliu/p/5100421.html 在学习<phpcms V9首页模板文件解析>的第七步,我们看到content_model ...

  2. php数组(array)输出三种形式

    $bbbb=array("11"=>"aaa","22"=>"bbb"); //只能输出值value不能输出 ...

  3. Excel等外部程序点击链接会带上IE信息的bug

    今天碰到一个问题,在Excel内点击链接到默认浏览器Chrome打开,奇怪的是服务端收到的Session一直对不上. 查了很久发现这个Excel到Chrome的跳转竟然带上了IE的Cookie 和 U ...

  4. Python 环境

    文章出处:http://www.cnblogs.com/winstic/,请保留此连接 总结一下自己使用python过程中安装三方包的方法 Python 安装 Python的安装非常简单,本人使用的w ...

  5. TC2.0中怎样调用汇编程序

    转载于: TC2.0中怎样调用汇编程序 一.概述 TC是美国BORLAND 公司在IBM PC机上开发的一个高效.优化的C编译程序,它自带高效的全屏幕编辑程序,在集成开发环境下可支持编辑.编译.连接调 ...

  6. WPF学习笔记-TextBox光标位置如何放到最后？

    TextBox光标位置如何放到最后? 使用SelectionStart : TextBox.SelectionStart = TextBox.Text.Length;

  7. 关于MYSQL优化(持续更新)

    *利用MYSQL数据缓存提高效率,注意事项: 1.应用环境:不经常改变的表及对此表相同的查询 2.不适用于服务器端编写的语句 3.根据数据使用频率,合理分解表 4.合理使用默认条件,提高命中率 5.统 ...

  8. cut 命令使用

    cut -d -f cut -c cut -d分隔符 -f分割后取的第几个字符串 cut -c从哪个字符开始取

  9. [BZOJ 3747] [POI 2015] Kinoman【线段树】

    Problem Link : BZOJ 3747 题解:ZYF-ZYF 神犇的题解 解题的大致思路是,当区间的右端点向右移动一格时,只有两个区间的左端点对应的答案发生了变化. 从 f[i] + 1 到 ...

  10. 终端上设置git

    http://blog.163.com/xianfuying@126/blog/static/21960005201181482518631/ 在-/.ssh的位置vi id_rsa.pub 拷贝的时 ...