• 用CSS Sprites合并WordPress表情图片教程

    用CSS Sprites将WordPress表情图片合并为一个文件这个想法其实我很早就有了,我已经在别的网站上见到这样的应用了(比如人间网就用了这个技术)。

    那么这个方法有什么好处呢?

    我想这个方法最大的好处就是大大减少了HTTP Request数量(要知道一般博客上面如果有表情的话,那么表情图片的数量少则有7、8个,多则可达20+,像我之前就用了24个)以及图片的大小(以前我24个GIF图是36K+,现在则只有一个大小为4.74KB的xiaonei.png),这对于大流量的网站的好处是显而易见的。

    [阅读全文...]

  • CSS Sprites技巧:单个图片插入多个链接

    平时我们做网页的时候会用到img标签来插入图片,再结合a标签可以给图片加上链接,但是其实单独用a标签就可以实现这样的效果,而且可以在单个图片中插入多个链接。

    本文的基本做法就是用CSS Sprites将多个图片合并为1个,用CSS中的background属性代替img标签,用background-position来实现多个图片链接的最终效果。

    例如原来3个图片链接的HTML代码如下

    [阅读全文...]