用CSS怎么做选项卡？

html-css023

用CSS怎么做选项卡？,第1张

授之于鱼 不如.....呵呵 上面的给你了代码 我来给你说下思路吧。这里最重要的是 css里的 display:none 这个的使用，当鼠标点中一个选项卡时，将自身的css中的display:none去掉 让其显示出来，让其他的选项卡中的css中添加display:none， 隐藏其他的选项卡。其实就是这个简单 ，具体的实现方法就是用js实现的。实现的方法有多种，上面给你的只是其中的一种。你可以去网上多搜些这方面的源代码，多多学习，希望你能编写出属于自己的代码~

给所有的选项卡添加style ： display：none；

然后写一个class： .on{display: block}

将这个class给第一个选项卡。

用js或者jQuery写：当鼠标移动到选项卡上方时，给该选项卡添加class（.on）：addClass("on")，鼠标离开时移出class（.on）:removeClass("on")

<style type="text/css">

a.imgDinamic:link img {width:50pxheight:50px}//静态大小

a.imgDinamic:hover img {width:150pxheight:200px}//鼠标移动到该位置时大小

</style>

<a class="imgDinamic" target="_blank"><img src="..."><img src="...">...</a>