gpt4 book ai didi

html - 为什么在网站加载时会出现此 Button 动画?

转载 作者:行者123 更新时间:2023-11-27 23:25:47 25 4
gpt4 key购买 nike

好的。我正在制作一个网站,但我已经搞砸了。在制作导航栏的过程中,我尝试制作的动画无法正常工作。

* {
margin: 0;
padding: 0;
font-family: Roboto;
}

header {
box-sizing: border-box;
max-height: 50px;
}

nav {
position: sticky;
top: 0;
padding: 7.5px;
}

.link {
padding: 7.5px;
display: inline-block;
font-size: 15px;
color: black;
text-decoration: none;
border-radius: 10px;
background-color: white;
transition-duration: 0.75s;
}

.linkanim {
padding: 7.5px;
display: inline-block;
font-size: 15px;
color: black;
text-decoration: none;
border-radius: 10px;
}

.linkanim:hover {
background-color: grey;
}

.icocredit {
position: absolute;
top: 97.5%;
font-size: small;
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link href="./stylesheets/main.css" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i&display=swap" rel="stylesheet">
<title>Test</title>
</head>
<body>
<header>
<nav>
<a class="link linkanim" href="#test">Test</a>

</nav>
</header>
<main>

</main>
<footer>
<div class="icocredit">Icons made by <a href="https://www.flaticon.com/authors/freepik" title="Freepik">Freepik</a> from <a href="https://www.flaticon.com/" title="Flaticon">www.flaticon.com</a></div>
</footer>
</body>
</html>

按钮只应在鼠标悬停在其上时显示动画。然而,按钮在页面加载时做了一些奇怪的 Action 。

最佳答案

我发现这要么是字体问题,要么是我在 chrome 中本地加载 HTML 文件,在真实的网络服务器上这不是问题。我会将此标记为答案,从而关闭此问题。

关于html - 为什么在网站加载时会出现此 Button 动画?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57786778/

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