html hover效果下拉个框,关于下拉菜单（CSS）中，“：hover”样式的设置问题？

各位大大，请帮忙解决一下这个问题，先谢谢！

由于之前的代码不是全部帖出，可能造成一点信息误解。

以下是针对这个问题另外写的代码：

.nav {

width: 50px;

height: 50px;

overflow:hidden;

background-color: #09F;

transition: all ease-in-out 2s 0s;

}

.nav:hover {

/* 指定高度 */

height: 500px;

}

---------------------------------------------------------------------------------------------------------

0000

---------------------------------------------------------------------------------------------------------

现在问题就只有一个：

.nav:hover {height: 500px;} 会正常显示过渡效果；

.nav:hover {height: auto;} 则不会显示过渡效果。

由于.nav即不同的子级菜单的高度属性都不一定相同，所以不可能给每一个.nav设置hover样式。

那么如何能做到，.nav自动适应高度，又可以正常显示过渡效果呢？

html hover效果下拉个框,关于下拉菜单（CSS）中，“：hover”样式的设置问题？相关推荐

html中加hover啥意思,css中hover是什么意思
css中:hover是一个伪类选择器,:hover伪类选择器在鼠标移到元素上时向此元素添加特殊的样式.:hover选择器适用于所有元素. 要使用css对HTML页面中的元素实现一对一,一对多或者多对一 ...
html下拉选择框箭头改为年,CSS自定义select下拉选择框的样式(不用其他标签模拟)...
今天群里有人问到怎么自定义select下拉选择框的样式,于是群里就展开了激烈的讨论,刚开始一直就是考虑怎样使用纯CSS实现,把浏览器默认的样式覆盖掉,但最后均因兼容问题处理不好而失败告终,最后的解决方 ...
京东下拉词框天猫下拉词框优化推广方法分享
前言京东跟天猫国内一流的电商购物平台,这个相信大家应该都知道,那么做为运营人员,我们应该如何更好的去运营好店铺,推广好产品呢? 除了常见的付费竞价推广例如:"京东快车.京东直投.展示付费广 ...
Poi（一）- excel添加下拉候选框（下）
因为直接使用excel的序列生成的下拉框,对数据长度有限制,所以这里记录另外一种生成下拉框的方式 1 excel是怎么添加下拉候选框的在sheet2页中选择一列添加数据选中这些数据,选择公式-&g ...
CSS中hover出现不生效的几个原因？
在设置CSS的hover时,有时会发现hover不起作用,总结一下原因: 提示:在 CSS 定义中,a:hover 必须被置于 a:link 和 a:visited 之后,才是有效的. 提示:在 CS ...
HTML设置不生效的原因,CSS中hover出现不生效的几个原因？
在设置CSS的hover时,有时会发现hover不起作用,总结一下原因: 提示:在 CSS 定义中,a:hover 必须被置于 a:link 和 a:visited 之后,才是有效的. 提示:在 CS ...
css中hover属性的使用技巧
hover属性用不同的书写方式,来改变不同关系的元素样式. 元素:hover 表示聚焦后改变自己元素:hover 元素表示聚焦后改变其子元素元素:hover + 元素表示聚焦后改变其指定的&q ...
css可以设置文本框颜色吗,如何在css中设置文本框颜色
如何在css中设置文本框颜色发布时间:2021-04-29 15:33:54 来源:亿速云阅读:72 作者:Leah 如何在css中设置文本框颜色?针对这个问题,这篇文章详细介绍了相对应的分析和解 ...
html中hover有静止的命令,我可以通过JavaScript禁用CSS：hover效果吗？
您可以使用javascript自己处理样式表和样式表规则 var sheetCount = document.styleSheets.length; var lastSheet = document. ...

html hover效果下拉个框,关于下拉菜单（CSS）中，“：hover”样式的设置问题？

html hover效果下拉个框,关于下拉菜单（CSS）中，“：hover”样式的设置问题？相关推荐

最新文章

热门文章