交互设计中心-72色

有的时候会想让li列表，或者文章带有标题和简短简介的列表整体加上一个连接直接连接到具体文章，这样有两种方法，

一种是用纯css来制作：

<a href="">

文章标题
详细简介

</a>

像上面的结构一样把标题和简介都放到a标签里，

优点：可以达到连接的效果，hover的时候可以兼容一切主流浏览器。
缺点：就是里面不能再有第二个连接了，还有就是这样做对搜索引擎不是很友好，可能会被看做有作弊的嫌疑。

第二种方法：

用js代码来实现这个效果，今天就用jQuery的简短代码来实现给大家把，
<script type="text/javascript">
$(document).ready(function(){
        
 $(".pane-list li").click(function(){
     window.location=$(this).find("a").attr("href");return false;
 });

}); //close doc ready
</script>

用这段代码就可以吧li里面的a连接的href地址重定向给li，这样点击li的时候就相当于点击了a标签，但是不用担心，只是find第一个a标签的href，所以li里面还可以多放一些连接也是不会出现出错的，只要让第一个连接放做li想要的连接就好了。