[转载]使用兼容ie6 ie7 ie8 FF的text-overflow:ellips
使用兼容ie6 ie7 ie8 FF的text-overflow:ellipsis超出文本显示省略号来代替截取函数更有利于seo,如果使用截取函数,源代码中的标题是显示不完整的,即便是在title属性中使用了显示完整标题,也不如完整的标题文字连接。这个方法使得两者兼得,既能显示完整标题又对搜索引擎友好。
如果不想显示省略号,那么把text-overflow属性值改成 clip 就行了,显示的还是完整的标题文字连接。
下面是html文件完整代码,已经测试过了,大家复制使用即可。
效果预览:
<!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>seo2012新浪博客</title>
<meta name="keywords" content="">
<meta name="description" content="">
<style type="text/css">
ul{border:1px solid #ccc;width:200px;}
ul li{display:block;}
ul li a{display:block;width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
</style>
</head>
<body>
<ul class="">
<li><a href="http://blog.sina.com.cn/u/2270076000" title="seo2012超出文本显示省略号更有利于seo">seo2012超出文本显示省略号更有利于seo</a></li>
<li><a href="http://blog.sina.com.cn/u/2270076000" title="seo2012超出文本显示省略号更有利于seo">seo2012超出文本显示省略号更有利于seo</a></li>
<li><a href="http://blog.sina.com.cn/u/2270076000" title="seo2012超出文本显示省略号更有利于seo">seo2012超出文本显示省略号更有利于seo</a></li>
<li><a href="http://blog.sina.com.cn/u/2270076000" title="seo2012超出文本显示省略号更有利于seo">seo2012超出文本显示省略号更有利于seo</a></li>
<li><a href="http://blog.sina.com.cn/u/2270076000" title="seo2012超出文本显示省略号更有利于seo">seo2012超出文本显示省略号更有利于seo</a></li>
<li><a href="http://blog.sina.com.cn/u/2270076000" title="seo2012超出文本显示省略号更有利于seo">seo2012超出文本显示省略号更有利于seo</a></li>
<li><a href="http://blog.sina.com.cn/u/2270076000" title="seo2012超出文本显示省略号更有利于seo">seo2012超出文本显示省略号更有利于seo</a></li>
<li><a href="http://blog.sina.com.cn/u/2270076000" title="seo2012超出文本显示省略号更有利于seo">seo2012超出文本显示省略号更有利于seo</a></li>
<li><a href="http://blog.sina.com.cn/u/2270076000" title="seo2012超出文本显示省略号更有利于seo">seo2012超出文本显示省略号更有利于seo</a></li>
</ul>
</body>
</html>
[转载]使用兼容ie6 ie7 ie8 FF的text-overflow:ellips的更多相关文章
- IE6 IE7 IE8 FF兼容符号
2.区别IE8.IE9 一般来说,我们写的结构比较好的时候,IE8/9下是没区别的.所以可能很少人关注只有IE8或只有IE9才识别的css hack. 因为IE8及以下版本是不支持CSS3的,但是我们 ...
- 兼容IE6/IE7/IE8/FireFox的css hack
兼容IE6/IE7/IE8/FireFox的css hack .color{ background-color: #CC00FF; background-color: #FF00009; *backg ...
- 给Select赋值 innerHTML 不兼容IE6\IE7\IE8\IE9
<select class="b-select" id="location-province" name="Province" def ...
- 下拉菜单select高度(兼容IE6/IE7/IE8/火狐等主流浏览器)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- CSS兼容IE6 IE7 IE8 IE9 Firefox的总结
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- DIV+CSS IE6/IE7/IE8/FF兼容问题汇总
1.IE8下兼容问题,这个最好处理,转化成ie7兼容就可以.在头部加如下一段代码,然后只要在IE7下兼容了,IE8下面也就兼容了 <meta http-equiv="x-ua-comp ...
- 最新区分兼容IE6/IE7/IE8/IE9/FF的CSS HACK写法和Css if hack条件语法操作说明
自从安装了IE8.0正式版本!木头 就对基本的几个 CSS HACK的做一下归纳!希望对网页前端布局DIV+CSS的实施者有所帮助! 本文就主要以:IE6+IE7+IE8+IE9+FF为主要研究对象 ...
- 区分兼容IE6/IE7/IE8/IE9/FF的CSS HACK写法
HACK原理:不同浏览器对各中字符的识别不同 在 CSS中常用特殊字符识别表: (1)*: IE6+IE7都能识别*,而标准浏览器FF+IE8是不能识别*的; (2)!important: 除IE6 ...
- DIV+CSS IE6/IE7/IE8/FF兼容问题大全
1. [代码][CSS]代码 1, FF下给 div 设置 padding 后会导致 width 和 height 增加, 但IE不会.(可用!important解决) 2, 居中问题. 1).垂直居 ...
随机推荐
- CodeChef FNCS
题面:https://www.codechef.com/problems/FNCS 题解: 我们考虑对 n 个函数进行分块,设块的大小为S. 每个块内我们维护当前其所有函数值的和,以及数组中每个元素对 ...
- DotNet 资源
DotNet 资源 目录 API 应用框架(Application Frameworks) 应用模板(Application Templates) 人工智能(Artificial Intelligen ...
- iOS中MVC等设计模式详解
iOS中MVC等设计模式详解 在iOS编程,利用设计模式可以大大提高你的开发效率,虽然在编写代码之初你需要花费较大时间把各种业务逻辑封装起来.(事实证明这是值得的!) 模型-视图-控制器(MVC)设计 ...
- Spring 配置自动扫描spring bean配置
<beans xmlns="http://www.springframework.org/schema/beans" xmlns:xsi="http://www.w ...
- [BZOJ 3236] [Ahoi2013] 作业 && [BZOJ 3809] 【莫队(+分块)】
题目链接: BZOJ - 3236 BZOJ - 3809 算法一:莫队 首先,单纯的莫队算法是很好想的,就是用普通的第一关键字为 l 所在块,第二关键字为 r 的莫队. 这样每次端点移动添加或删 ...
- Children of the Candy Corn
poj3083:http://poj.org/problem?id=3083 题意:给你一个迷宫,然后给你一个起点和终点,现在给你种规则,一种是先向左,无法向左则向前,无法向前则向右,否则则向后,另外 ...
- 权重随机算法的java实现
一.概述 平时,经常会遇到权重随机算法,从不同权重的N个元素中随机选择一个,并使得总体选择结果是按照权重分布的.如广告投放.负载均衡等. 如有4个元素A.B.C.D,权重分别为1.2.3.4,随机结果 ...
- JavaScript 函数和对象
在javascirpt 世界中,所有的函数都是对象,并且还可以被用来创建对象. function make_person(firstname, lastname, age) { person = {} ...
- Farm Irrigation(并查集)
Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Total Submission( ...
- 【转】Usage of sendBroadcast()
原文网址:http://stackoverflow.com/questions/4883079/usage-of-sendbroadcast sendBroadcast() - Should it b ...