You are here: Home » All Categories » » 给不同类型的网盘链接和外链加了个性图标

给不同类型的网盘链接和外链加了个性图标

Jul 27th, 2009 20:50 | Leave a comment?(35) Go to comments

今天在木木木木木的帮助下用 css + gif图片“给不同类型的网盘链接加了个性图标”,并且给外链加上外链标志,效果如下:

ziddu网盘
uushare网盘
VIP-file网盘
纳米盘
大米盘
Skydrive
Rayfile
.rar .zip
.7z
外链

图片大小统一用16*16,css 代码参考下面的。

其中的外链的 css 代码如下:

a[href^="http:"]{background:url(images/external.gif) no-repeat right center;padding-right:19px;margin-right:6px;}

其中网盘链接的 css 代码如下:

a[href^="http://www.namipan.com/"]{background:url(images/namipan.gif) no-repeat left center;padding-left:19px;}
a[href^="http://www.damipan.com/"]{background:url(images/damipan.gif) no-repeat left center;padding-left:19px;}
a[href^="http://www.rayfile.com/"]{background:url(images/rayfile.gif) no-repeat left center;padding-left:19px;}

其中文件类型的 css 代码如下:

a[href$=".zip"],a[href$=".7z"],a[href$=".rar"]{background:url(images/rar.gif) no-repeat left center;padding-left:19px;}
a[href$=".doc"]{background:url(images/word.gif) no-repeat left center;padding-left:19px;}
a[href$=".pdf"]{background:url(images/pdf.gif) no-repeat left center;padding-left:19px;}

上面的都是全局定义,我就只在 .post 里面的链接才使用这些个性链接图标,只要在上面的“a[href……”前面加: .post 就可以了,懂点 css 的不说也知道。

相关详细内容可以参考木木的《给不同类型的网盘链接和外链加了个性图标》,他那里还有个性图片下载。

补充:

上面的效果在该死的 IE6 下无效,但大家别忘了dean edwards和他的开源项目ie7-js,我们只要使用一段javascript,就能让 IE6 表现得像个正常的、兼容web标准的浏览器。(第一次看到此方法是Betty的这篇文章《让ie6像个正常的浏览器》)

那么要使 IE6 也有上面的效果,只要在你的主题文件 hearder.php 里面的 <head></head> 之间加上下面的代码就OK了:(复制后自行把 “ 改为英文的 ",《》改为英文的<>)

- -!  贴不了代码,直接去ie7-js

声明: 除非注明,ZWWoOoOo文章均为原创,转载请以链接形式标明本文地址
本文地址: http://zww.me/archives/24608

Filed under

| Tags:

,

Related Posts

Most Popular

35 Comments.

⊕Leave a comment?
  1. derek derek Internet Explorer 7.0Windows Vista

    可有可无的功能啊,精简才是王道;主要是我懒得改

    沙发!软软很舒服!1
  2. 博译论 博译论 Firefox 3.0.12Windows XP

    哇,你好多盘啊,我到现在还是rp

    板凳!有点硬!2
  3. zwwooooo zwwooooo Firefox 3.5.1Windows XP

    @derek 我有时间,呵呵

    @博译论 本来我是很专一的,但河里的蟹逼我花心!

    地板!又硬又冷!3
  4. 久酷 久酷 Firefox 3.5.1Windows XP

    不错,很好的做法呢^_^ :lol: :lol:

    4楼
  5. 要饭的 要饭的 Firefox 3.5Windows XP

    呵呵,暂时用不上,不过很漂亮的说

    5楼
  6. zwwooooo zwwooooo Firefox 3.5.1Windows XP

    @久酷 @要饭的

    其实也就一段css和几个gif图片,所以就加上了。不过这是个很个性的东西,因为每个人用的网盘不同

    6楼
  7. 吖Bee 吖Bee TheWorld BrowserWindows XP

    哈哈,这个功能我喜欢...

    7楼
  8. 奋飞 奋飞 Firefox 3.5.1Windows XP

    哈哈,这些确实方便啊

    8楼
  9. zwwooooo zwwooooo Firefox 3.5.1Windows XP

    @吖Bee @奋飞

    既然只是简单几行css就加上了,呵呵

    9楼
  10. junjun junjun Firefox 3.0.12Windows XP

    嗯,我那个页面要简洁再简洁,不要那么多图标

    10楼
    • zwwooooo zwwooooo Firefox 3.5.1Windows XP

      呵呵,你那主题够简洁的了,连线都看不到几条。我自己的想法是简而不简——可惜很难达到这个效果

  11. 所以说 所以说 Maxthon 2.0Windows XP

    原来这个是CSS做的啊= =还以为是手动的//

    11楼
  12. 卢松松 卢松松 Firefox 3.5.1Windows XP

    IE6 下无效????
    现在绝大多数人用的都是IE6呀

    12楼
    • zwwooooo zwwooooo Firefox 3.5.1Windows XP

      这个……你没看完我的文章吧……我在下面不是写了解决方法么?所以在ie6下一样有效。

  13. 小明猪 小明猪 Firefox 3.5.1Windows Vista

    支持一下,效果真的不错的说~ :lol:

    13楼
  14. Y.Jiajia Y.Jiajia Internet Explorer 7.0Windows XP

    我以前用过IE7.js但是后来觉得只为FixIE6就用了一个JS类库,有些太浪费,后来就取消了。现在一般情况都用JS直接hack~

    14楼
    • zwwooooo zwwooooo Firefox 3.5.1Windows XP

      才几十k无所谓了,既然我的主题用了jQuery就更无所谓了。 :mrgreen:

  15. 小T 小T Firefox 3.0.6Windows XP

    我一般用张图贴上就完了,不想这么麻烦。。主要是懒 :)

    15楼
  16. shun shun Opera 9.64Windows XP

    现在用的网盘不多了

    16楼
  17. zwwooooo zwwooooo Firefox 3.5.1Windows XP

    @小明猪 只是个性化一下

    @小T 一张图?就是一种方式?

    @shun 我是被逼的。

    17楼
  18. 回憶 回憶 Firefox 3.5.1Windows XP

    不錯,學習了!

    18楼
  19. 小毅 小毅 Firefox 3.5.1Windows 7

    惊奇的是看到了《让ie6像个正常的浏览器》这篇文章,呵呵。

    DIY万岁,折腾得永生。

    19楼
    • zwwooooo zwwooooo Firefox 3.5.1Windows XP

      :mrgreen:

      对了,你的博客咋不折腾了?怎么还是那样?

  20. 砼砼 砼砼 Internet Explorer 8.0Windows XP

    必须承认,我很懒

    20楼
  21. 0cai 0cai GreenBrowser Windows XP

    恩 不错的解决方案 记下了 在用户体验上有好处!

    21楼
  22. Sivan Sivan Internet Explorer 6.0Windows XP

    CSS3就连IE7都有很多属性不支持。

    22楼
    • zwwooooo zwwooooo Firefox 3.5.1Windows XP

      其实微软应该像对付盗版那样强迫用户升级到ie8——不过国内的政府、银行等网就会死翘翘,但这样也可以促使这些顽固分子升级他们的网站。

  23. 世麟 世麟 Firefox 3.5.2Windows XP

    不需要了,精简是王道!

    23楼
    • zwwooooo zwwooooo Firefox 3.5.1Windows XP

      其实太精简也是个极端,恰到好处是最好,但往往是最难的。

  24. ligyxy ligyxy Internet Explorer 8.0 (Compatibility Mode)Windows 7

    skydrive这样的网盘地址没办法有个统一的匹配规则。除非CSS支持正则表达式。。

    24楼
    • zwwooooo zwwooooo Firefox 3.5.2Windows XP

      对于个人来说前缀一样的,但你想设置一个大家通用的网址是不行的——skydrive是类似每个用户一个子域名前缀。

  25. mysuperwoofer mysuperwoofer Internet Explorer 8.0Windows Server 2003

    你的站做的很好

    25楼

Leave a Reply


Welcome! o(∩_∩)o
X