css 文本超出范围显示省略号
<!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 文本超出范围显示省略号的更多相关文章
- CSS——文本超出隐藏显示省略号
文本超出隐藏显示省略号 1.单行文本的溢出显示省略号 overflow: hidden; text-overflow:ellipsis; white-space: nowrap; // overflo ...
- css文本超出隐藏显示省略号
p style="width: 300px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;"> 如 ...
- css文字超出自动显示省略号
只针对单行文本有效: 01.针对块状元素 ul li{ width: 180px; text-overflow: ellipsis; white-space: nowrap;/*禁止自动换行*/ ov ...
- CSS文本溢出,显示省略号(...)
方式1:这种方式就是必须要跟width搭配使用,当你使用的display:flex; 的时候可能会影响样式 width: 200px; overflow: hidden; /*超出部分隐藏*/ tex ...
- css兼容大部分浏览器的文本超出部分显示省略号
css之字体多行省略(兼容大部分浏览器) 字体单行显示省略号 <style> .box1{ width: 500px; height: 1.5em; overflow: hidden; t ...
- CSS实现不换行/自动换行/文本超出隐藏显示省略号
在写页面的时候,我们经常会需要用到关于文本的换行,强制换行以及显示几行超过显示省略号等,今天我们就对这些问题来做个汇总吧! 1.自动换行 div{ word-wrap:break-word; word ...
- css文本溢出隐藏显示省略号(单行+多行)
文本超出若干行就换行,这个功能几乎每个文本浏览网站都会用到,实现它的办法也有很多,今天简单的介绍一下实现它的方法. 一. 单行文本不换行,并将超出文本隐藏 .box-content{ ove ...
- css/js 超出部分显示省略号
1.js方法 function cutString(str, len) { //length属性读出来的汉字长度为1 if (str.length * 2 <= len) { return st ...
- CSS3文本超出容器显示省略号之text-overflow属性
text-overflow:ellipsis; overflow:hidden; white-space:nowrap; 要想实现文本超出容器时显示省略号,上面3个属性必须同时搭配使用
随机推荐
- Redis 分布式缓存 Java 框架
为什么要在 Java 分布式应用程序中使用缓存? 在提高应用程序速度和性能上,每一毫秒都很重要.根据谷歌的一项研究,假如一个网站在3秒钟或更短时间内没有加载成功,会有 53% 的手机用户会离开. 缓存 ...
- [c/c++] programming之路(15)、多维数组和二分查找法,小外挂
一.多维数组 #include<stdio.h> #include<stdlib.h> void main(){ ][]; int i,j; ; i < ; i++) { ...
- Unicode编码问题 如:\u529e\u7406\u9996\u6c7d\u52a0\u6cb9
python 遇到\u529e\u7406\u9996\u6c7d\u52a0\u6cb9 解决方法: a = "\u529e\u7406\u9996\u6c7d\u52a0" b ...
- --save 与--save-dev的区别
一.模式 运行webpack命令时,一定要指定模式. webpack --mode developmentwebpack --mode production二.--save -dev --save:将 ...
- JavaScript-DOM(3)
事件处理 事件类型 <body> <!--方式1:直接带html代码中嵌入js代码--> <button onclick="console.log('事件1') ...
- TestNG详解(单元测试框架)
一.TestNG的优点 1.1 漂亮的HTML格式测试报告 1.2 支持并发测试 1.3 参数化测试更简单 1.4 支持输出日志 1.5 支持更多功能的注解 二.编写TestNG测试用例的步骤 2.1 ...
- _luckdraw
该表可以控制进行抽奖.10连抽: `comment` 备注 `itemId` 物品ID `chance`几率 `itemCount` 数量
- 《深入理解Nginx:模块开发与架构解析》读书笔记
1.nginx的特点:快.扩展性强.可靠性强.内存低消耗.支持高并发.热部署.开源免费 2.nginx由master进程来管理多个(CPU数)worker进程 3.配置按功能分,有4类: 1)用于调试 ...
- Anaconda 创建环境
2019-03-25 17:10:51 Anaconda 给不同的项目创建不同的环境真的非常重要,最近在使用flask的时候在base环境中安装flask-bootstrap,竟然将我原本的py3.7 ...
- guxh的python笔记十:包和模块
1,包和模块 包package:本质就是一个文件夹/目录,必须带一个__init.__.py的文件 模块module:.py结尾的python文件 2,导入方法 import pandas, coll ...