gpt4 book ai didi

jQuery:淡化 CSS 悬停在静态按钮之上?

转载 作者:太空宇宙 更新时间:2023-11-04 15:52:41 29 4
gpt4 key购买 nike

我正在创建一个导航并且已经为按钮制作了 CSS 属性。

我想在静态按钮属性之上淡入悬停属性。

这样做最有效的方法是什么?

CSS 看起来像这样:

<div id="nav">
<form method="post" action="">
<a>Home</a>
<a>Link2</a>
<a>Link3</a>
</form>
</div>

#nav {
position:absolute;
margin-top:96px;
margin-left:30px;
height: 450px;
width: 140px;
font-family:"Book Antiqua";}

#nav a {
background:url(Images/Button.png);
height:28px;
width:130px;
font-family:"Book Antiqua";
font-size:14px;
text-align:center;
color:#C60;
text-decoration:none;
background-position:center;
margin:auto;
display:block;
position:relative;
line-height:190%;
}

#nav a:hover {
background:url(Images/Button%20Hover.png);
height:34px;
width:140px;
font-family:"Book Antiqua";
font-size:16px;
text-align:center;
color:#C60;
text-decoration:none;
margin:-3px;
z-index:2;
line-height:210%;
text-indent:-10px;}

#nav a:active {
background:url(Images/Button%20Hover.png);
height:34px;
width:140px;
font-family:"Book Antiqua";
font-size:14px;
text-align:center;
color:#862902;
text-decoration:none;
margin:0 -3px;
z-index:2;}

谢谢。

最佳答案

使用 css 的 transition 属性...

-webkit-transition:all .3s;
-moz-transition:all .3s;
-o-transition:all .3s;
-ms-transition:all .3s;

将此添加到 #nav a...

这适用于 Google Chrome、Mozilla Firefox、Opera 和最新的 IE...

关于jQuery:淡化 CSS 悬停在静态按钮之上?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10983250/

29 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com