firefox3下显示图片占位符的方法

Julian_Yuen

因为一直被这个问题困扰，到网上搜索了一下，找到了方法，特来分享。

======================================

占位符测试页面 https://bug58646.bugzilla.mozilla.org/attachment.cgi?id=72516

将以下内容保存到profile\chrome目录下的 userContent.css 文件中
userContent.zip (310 Bytes, 下载次数: 2254)

2009-3-14 16:36 上传

点击文件名下载附件

1. /*
   
2. *显示缺失图像占位符
   
3. */
   
4. 
   
5. 
   
6. @namespace url(http://www.w3.org/1999/xhtml);
   
7. 
   
8. @-moz-document url-prefix(http), url-prefix(file) {
   
9.    img:-moz-broken{
   
10.    -moz-force-broken-image-icon:1;
    
11.    width:24px;
    
12.    height:24px;
    
13.   }
    
14. }

复制代码

该方法只对firefox3有效

官方说明2.0应该是不行:
http://developer.mozilla.org/En/CSS::-moz-broken
"This article covers features introduced in Firefox 3"
-moz-broken应该是3.0才引入的

参考
http://bbs.et8.net/bbs/showthread.php?t=943395
http://www.firefox.net.cn/newforum/viewtopic.php?p=184415

[ 本帖最后由 Julian_Yuen 于 2009-3-14 16:36 编辑 ]

ledled

我怎么一点变化都没有

1. /*
   
2. * Edit this file and copy it as userContent.css into your
   
3. * profile-directory/chrome/
   
4. */
   
5. 
   
6. /*
   
7. * This file can be used to apply a style to all web pages you view
   
8. * Rules without !important are overruled by author rules if the
   
9. * author sets any.  Rules with !important overrule author rules.
   
10. */
    
11. 
    
12. /*
    
13. * example: turn off "blink" element blinking
    
14. *
    
15. * blink { text-decoration: none ! important; }
    
16. *
    
17. */
    
18. 
    
19. /*
    
20. * example: give all tables a 2px border
    
21. *
    
22. * table { border: 2px solid; }
    
23. */
    
24. 
    
25. /*
    
26. * example: turn off "marquee" element
    
27. *
    
28. * marquee { -moz-binding: none; }
    
29. *
    
30. */
    
31. 
    
32. /*
    
33. * For more examples see [url]http://www.mozilla.org/unix/customizing.html[/url]
    
34. */
    
35. 
    
36. /*
    
37. *显示缺失图像占位符
    
38. */
    
39. 
    
40. 
    
41. @namespace url([url]http://www.w3.org/1999/xhtml[/url]);
    
42. 
    
43. @-moz-document url-prefix(http), url-prefix(file) {
    
44.    img:-moz-broken{
    
45.    -moz-force-broken-image-icon:1;
    
46.    width:24px;
    
47.    height:24px;
    
48.   }
    
49. }

复制代码

Julian_Yuen

放到指定目录后 重启ff3，然后测试页面 https://bug58646.bugzilla.mozilla.org/attachment.cgi?id=72516

Julian_Yuen

把那啥[url]去掉

ledled

已经去掉了, 结果还是没有变化


FF的占位符是不是" X "?

Julian_Yuen

应该有7个占位符的，见一楼补充的usercontent.css和效果图

ledled

弱弱地问下具体路径在哪里

Julian_Yuen

XP 大概在 C:\Documents and Settings\yourname\Application Data\mozilla\profile\******\chrome\
vista的类似，默认在C:\user下面，找不到的话直接搜索mozilla或者profile或者chrome吧

[ 本帖最后由 Julian_Yuen 于 2009-3-14 20:32 编辑 ]

ledled

成功了

Julian_Yuen

成功就好