纯CSS在Firefox模拟text-overflow: ellipsis效果
作者：嗷嗷 来源：样式之美 发布时间：2009-03-17 12:49:00
标签：CSS,Firefox,text-overflow
text-overflow这个属性真让Firefox折腾，虽然之前有写过Firefox通过XUL实现text-overflow:ellipsis的效果，不过要 * xbl来用也就一直没用，虽然想过Data URI，但其实还不如 * xbl。
这两天在论坛看到14px同学写的超过宽度显示省略号（无js全兼容），想法很有创意，使用一张图片来做“…”，另一张图片用来在字不够长的情况下盖掉“…”，原文攻略很完整，大家可以去看一下思路，个人认为的缺点就是用了图片，不够灵活，所以我就悄悄修改了代码，思路是用父一层的元素的伪类:after来完成“…”，再用元素自身伪类:after来盖掉不应该出来的“…”，看一下效果：
看上去好像很理想，但是text-overflow也不是那样好模拟的，有兴趣的同学看看demo就知道还有多少问题。
当成技术练手还是不错滴，不过估计应该不会拿着应用。
0
投稿猜你喜欢
PyCaret 是一个开源、低代码的 Python 机器学习库，可自动执行机器学习工作流。它是一种端到端的机器学习和模型管理工具，可以以指数- 随手google咗一下，基本上都用select实现非阻塞监听，但问题是，监听的是用select之后是不能像getchar()那样
- 1.自定义用户表 注意事项必须在settings中配置AUTH_USER_MODEL这个字段 # 覆盖默认的用户模型，使用自定义
- 在JS中将JSON的字符串解析成JSON数据格式，一般有两种方式： 1.一种为使用eval()函数。 2. 使用Function对象来进行返
- SQL> show all --查看所有68个系统变量值 SQL> show user --显示当前连接用户 SQL> s
- 用CSV格式来保存文件是个不错的主意，因为大部分程序设计语言和应用程序都能处理这种格式，所以交流起来非常方便。然而这种格式的存储效率不是很高
- 本文实例讲述了Python排序搜索基本算法之冒泡排序。分享给大家供大家参考，具体如下：冒泡排序和选择排序类似，也是第n次把最小的元素排在第n
- 本文实例为大家分享了js实现QQ邮箱邮件拖拽删除的具体代码，供大家参考，具体内容如下步骤分析：根据数据结构生成HTML结构全选和单选功能的实
- vue常用内置指令<!DOCTYPE html><html lang="en"><head
- 这篇文章主要介绍了通过实例解析python描述符原理作用,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的
- 推荐idea最新激活码：最新Idea激活码永久激活(最新测试有效)https://www.jb51.net/article/178193.h
- 本文为大家分享了windows下pycharm安装、创建文件、配置默认模板的具体步骤，供大家参考，具体内容如下步骤： 下包 —->安装
- 关于维卷积的理解功能一维卷积一般用于处理文本数据，常用语自然语言处理中，输入一般是文本经过embedding的二维数据。定义tf.layer
- 问题缘由：负责公司的开发平台研发工作，考虑的知识产权的保护工作，必须要考虑java的加密技术和js脚本的加密技术。在目前java加密很容易破
- 茎叶图from itertools import groupbynums2=[225, 232,232,245,235,245,270,22
- 对于初学者，入门至关重要，这关系到初学者是从入门到精通还是从入门到放弃。以下是结合Python的学习经验，整理出的一条学习路径，主要有四个阶
- Go 搭建一个简单 WebSocket 服务端代码例子 test.go, 如下：package mainimport ( "fmt
- 本文实例讲述了python实现希尔排序算法的方法。分享给大家供大家参考。具体如下：def shellSort(items): i
- pytest介绍pytest是一个非常成熟的全功能的Python测试框架，主要特点有以下几点：1、简单灵活，容易上手，文档丰富；2、支持参数
- 本文实例讲述了vue实现图片懒加载的方法。分享给大家供大家参考，具体如下：vue图片懒加载使用首先第一步，安装插件vue-lazyloadn
