css图像映射

上次提到王伟找我问问题，嗯，他还留了两个问题给我，一个是tab切换，我直接给他jqueryui的tab链接了，另一个就是带图片的map映射，今天晚上花了大量的时间做了一下。本来很早就做出来了的，但我试着让它更丰富了一些，自己借着这个例子试了一下css3的box-shadow、border-radius、opacity属性，还加了个箭头，这个因为一个小知识点不知道花了我很长时间，箭头的图片一直加载不了，后来google知道是因为background:url(image.gif)加载的是css所在文件的文件夹路径，比如文件目录是 /root -----images/arrow.gif -----css/style.css -----index.htm 你得到的是style.css所在的文件路径，那你应该使用background:url(../images/image.gif)来加载图片。 再记下css3的box-shadow用法： box-shadow有六个可设值:img{box-shadow:阴影类型  X轴位移  Y轴位移  阴影大小  阴影扩展  阴影颜色 } 参考资料：w3school  帕兰印象  css3.info 另外记一下下次要详细总结的概念：position的用法。还有今天晚上做这个demo的时候看到豆瓣读书的书籍的detail-iframe用的是display:none，记得《精通css》上讲出于为视力障碍使用读屏软件的访客考虑，是不推荐这种用法的，应该用绝对定位加上left负值来隐藏它们，我在例子里面用的就是这个方法。也许是出于自己还不知道的方面考虑的吧，下次找个时间发个豆邮问一下克军老师。 这是今天晚上的DEMO。