通过图片定位给一张图片添加多个链接

标签：style   blog   http   ar   io   os   使用   sp   on   

　　我们在建站的时候使用图片素材能为整个网站增色不少，但是太多的边框按钮图片会增加请求次数，从而降低网站加载速度，这时我们可以考虑将多个小图片元素集合到一张图片中，然后通过图片定位的方式来调用，这样所有的小图片总共只请求一次。跟着ytkah来试试吧

　　设计好图片，上传。我们先确定所要的小图片元素的位置和面积，可以用photoshop来查找，也可以通过下面这个小工具来实现：

　　http://www.w3school.com.cn/tiy/t.asp?f=html_ismap

　　修改图片地址，在<img>位置把图片url粘贴进去，提交代码。请把鼠标移动到图像上，看一下状态栏的坐标如何变化。**/html_ismap.html?86,130，86是横坐标x的值，130是竖坐标y，移动鼠标，这两个参数都在变。

　　以这篇文章为例微信那些年走过的开放之路，我们要在一些位置加上链接，比如微信小店那个位置，查看源代码

<a style="width: 225px; height: 60px; position: absolute; left: 145px; top: 260px;" title="微信小店" href="http://www.cnblogs.com/ytkah/p/3760339.html"> </a>

　　width: 225px; height: 60px;这个是微信小店图片大小，left: 145px; top: 260px;这个是小图片所在的位置

　　怎么样？学会了吗？本文部分参考资料

通过图片定位给一张图片添加多个链接

标签：style   blog   http   ar   io   os   使用   sp   on   

原文地址：http://www.cnblogs.com/ytkah/p/4158246.html