我已经创建了一个HTML网页，每当您将鼠标悬停在某个元素上时，下划线应逐渐变为红色。但是，它会闪烁白色，而then会变成红色。我该如何解决？
.nav a {
font-size : 35px;
color : white;
text-decoration : none;
position : relative;
right : -100px;
bottom : -20px;
transition : 0.5s;
opacity : 1;
}
.nav a:hover {
text-decoration : red underline;
}
这是因为CSS过渡总是需要一个起始值。否则它将无法将属性更改为所需的值。
因此，在您的示例中，您的过渡从“无”过渡到了red underline。因此，浏览器仅添加白色下划线（默认下划线），然后变为红色。
您可以尝试使用透明作为基础色：
body {
background: green;
}
nav a {
font-size : 35px;
color : white;
text-decoration : transparent underline; /* This line has changed */
position : relative;
right : -100px;
bottom : -20px;
transition : 0.5s;
opacity : 1;
}
nav a:hover {
text-decoration : red underline;
}<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<nav>
<a href="#">Link 1</a>
<a href="#">Link 2</a>
<a href="#">Link 3</a>
</nav>
</body>
</html>