关于新闻字段控制问题?? |
||||
---|---|---|---|---|
新进会员
注册日期:
6/10 17:58 来自 北京
所属群组:
注册会员
帖子:
5
等级: 1; EXP: 34
HP: 0 / 8 MP: 1 / 12 |
下面俩张图片分别是在宽屏和宰屏下显示的效果 在ie浏览器下的问题
我加了这个样式 overflow:hidden; 但是在浏览器下出现了一下问题 请教一下各位前辈 除了加这个 还需要控制 加哪些 对div不太熟悉 请各位帮忙看一下....先谢谢了 ..... 附件: 未命名1.jpg (15.18 KB) 未命名.jpg (18.72 KB)
7/14 18:03
|
|||
|
回复: 关于新闻字段控制问题?? |
||||
---|---|---|---|---|
Support Team
注册日期:
2006/11/30 20:48 来自 beijing
所属群组:
网站管理员 注册会员 Dev+Hack 资料整理组 等级: 29; EXP: 22
HP: 141 / 705 MP: 369 / 8262 |
这是什么下拉菜单吗?
7/16 21:35
|
|||
|
回复: 关于新闻字段控制问题?? |
||||
---|---|---|---|---|
新进会员
注册日期:
6/10 17:58 来自 北京
所属群组:
注册会员
帖子:
5
等级: 1; EXP: 34
HP: 0 / 8 MP: 1 / 12 |
嗯 这是下拉菜单
加省略号解决了 不过只在ie下显示 火狐不显示省略号, 但是在 火狐下面怎么加省略号呢?? 附件: QQ截图未命名.png (4.62 KB) QQ截图未命名1.png (9.22 KB)
7/19 11:25
|
|||
|
回复: 关于新闻字段控制问题?? |
|||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Support Team
注册日期:
2006/11/30 20:48 来自 beijing
所属群组:
网站管理员 注册会员 Dev+Hack 资料整理组 等级: 29; EXP: 22
HP: 141 / 705 MP: 369 / 8262 |
Name: text-overflow-mode clip : 不显示省略标记(…),而是简单的裁切 至于为什么一开始我说text-overflow是一个比较特殊的样式呢?因为我们可以用它代替我们通常所用的标题截取函数,而且这样做对搜索引擎更加友好,如:标题文件有50个汉字,而我们的列表可能只有300px的宽度。如果用标题截取函数,则标题不是完整的,如果我们用CSS样式text-overflow:ellipsis,输出的标题是完整的,只是受容器大小的局限不显示出来罢了(表现上是超出部分显示省略标记…)。 text-overflow: ellipsis属性仅是注解,当文本溢出时是否显示省略标记。并不具备其它的样式属性定义。我们想要实现溢出时产生省略号的效果。还必须定义:强制文本在一行内显示(white-space:nowrap)及溢出内容为隐藏(overflow:hidden)。只有这样才能实现溢出文本显示省略号的效果。http://leeiio.me/wp-content/themes/li ... orful/images/out-link.gif); background-attachment: initial; background-origin: initial; background-clip: initial; background-color: initial; padding-right: 12px; background-position: 100% 50%; background-repeat: no-repeat no-repeat; ">Via. 那么,如果我们要给p标签定义text-overflow:ellipsis就可以这么写: 使用样式前: 我是一段测试文字,请分别用IE,Safari,chrome,opera浏览器查看我哦! 使用样式后: 浏览器兼容状况 OH,FML!Firefox不支持这个属性!这回,Firefox你也太另类了吧!还有别的办法么,当然有,方法还挺多的。 首先,我们创建XUL,它应该被保存为ellipsis.xml: 然后我们需要把这个xml文件放到一个目录,原来的css需要加一条,变成这样 虽然Firefox通过XUL的方式实现了ellipsis,但是还是需要注意以下这些问题: 如果你只是给p节点绑定了XUL,那么在Firefox下你将看不到haha这个内容。 参考资料: http://www.w3.org/TR/2003/CR-css3-text-20030514/ http://www.quirksmode.org/css/contents.html http://bugzilla.mozilla.org/show_bug.cgi?id=312156 http://developer.mozilla.org/En/XUL http://developer.mozilla.org/En/XUL/Description http://www.rikkertkoppes.com/thoughts/2008/6/ http://www.w3.org/TR/css3-text/ 既然XUL无法完美解决Firefox下文字溢出显示…,那么我们就求助javascript吧,当然,并不是古老的截取一定数目的字符来实现。 这段js的原理很简单,就是通过不断的比较宽度值,然后逐个缩短字符宽度,当最后宽度合适的时候,停止循环,就实现了文字溢出显示…的效果。 js里有个判断就是当样式里出现text-overflow或者-o-text-overflow的时候,便不会执行这段js。因为支持这两个属性的浏览器可以自己实现ellipsis效果。 这两种方法都可以实现Firefox下ellipsis的效果,如何取舍使用,具体还得根据你要运用到的项目的具体情况来具体分析,XUL实现的方法的不足之处在以上已经很详尽地列举了,如果你可以避免或者说这些无关你项目的大问题,那么XUL不失一个好方法。 至于其他的一些方法你可能在网上也有看到,比如用:after伪类来实现等,个人不推荐,所以我这里也不细说了,如果你有更好的方法,也希望能与我分享,谢谢观看!
7/19 16:20
|
||||||||||||||||
|
回复: 关于新闻字段控制问题?? |
||||
---|---|---|---|---|
新进会员
注册日期:
9/22 1:59 所属群组:
注册会员
帖子:
3
等级: 1; EXP: 10
HP: 0 / 2 MP: 1 / 1 |
顶了
9/23 20:58
|
|||
|