首页 >web前端 >html教程 >这个效果能用CSS做出来吗? 关于hover的吧_html/css_WEB-ITnose

这个效果能用CSS做出来吗? 关于hover的吧_html/css_WEB-ITnose

WBOY
WBOY原创
2016-06-21 09:47:12967浏览

css js

我的书架
指上去显示了下面的框架。求大牛。。。,,,,

回复讨论(解决方案)

hover可以让页面显示东西  但数据貌似的用js取吧?

题主既然都知道用hover了,不知道还有神马疑惑的?

定位问题不知道怎么弄?还是。。?

抛开IE6只支持a:hover不考虑,我们先确定一下容器的从属关系。

div.drop
|---div.droptab
|---div.dropdown
    |--ul.mybook_list
    |--a.link

hover应该应用在div.drop,开始div.dropdown是隐藏的,当div.drop被hover的时候,div.dropdown才显示,同时div.droptab也相应改变一下背景和边框.

然后是布局问题,div.drop定义为relative,div.dropdown设置为absolute,left:0,控制top值让灰色的边框刚好被上面的tab盖住一个像素,或许还需要z-index来帮忙。

就这些,基本没什么难点了。
给思路比贴代码对你更有益。

题主既然都知道用hover了,不知道还有神马疑惑的?

定位问题不知道怎么弄?还是。。?

抛开IE6只支持a:hover不考虑,我们先确定一下容器的从属关系。

div.drop
|---div.droptab
|---div.dropdown
    |--ul.mybook_list
    |--a.link

hover应该应用在div.drop,开始div.dropdown是隐藏的,当div.drop被hover的时候,div.dropdown才显示,同时div.droptab也相应改变一下背景和边框.

然后是布局问题,div.drop定义为relative,div.dropdown设置为absolute,left:0,控制top值让灰色的边框刚好被上面的tab盖住一个像素,或许还需要z-index来帮忙。

就这些,基本没什么难点了。
给思路比贴代码对你更有益。
额,关于hover只会用在a:hover{}...。。。思路想的到。代码还没研究好。。

题主既然都知道用hover了,不知道还有神马疑惑的?

定位问题不知道怎么弄?还是。。?

抛开IE6只支持a:hover不考虑,我们先确定一下容器的从属关系。

div.drop
|---div.droptab
|---div.dropdown
    |--ul.mybook_list
    |--a.link

hover应该应用在div.drop,开始div.dropdown是隐藏的,当div.drop被hover的时候,div.dropdown才显示,同时div.droptab也相应改变一下背景和边框.

然后是布局问题,div.drop定义为relative,div.dropdown设置为absolute,left:0,控制top值让灰色的边框刚好被上面的tab盖住一个像素,或许还需要z-index来帮忙。

就这些,基本没什么难点了。
给思路比贴代码对你更有益。
只会a:hover{}。。。定位不熟悉,先研究研究

还是看哈代码研究。。。。

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn