将鼠标悬停在另一个元素上时,元素未出现

问题描述 投票:0回答:1

当我将鼠标悬停在 p1 元素上时,h1 元素应该会出现,但它没有出现。我对此有点困惑,因为当我查找它时,这就是它所说的,但它似乎不起作用。

<!DOCTYPE html>
<html>
<head>
  <link rel="stylesheet" href="style.css">
</head>
<body>

<h1>Welcome to IT202</h1>
<p><strong>Mouse over the text "Show Welcome" and the welcome message is displayed. Mouse out and the welcome messages disappears!</strong></p>
<p1>Show Welcome</p1>

</body>
h1
{
    background-color: blueviolet;
    color: white;
    width: 250px;
    border: 2px solid black;
    padding-top:20px;
    padding-bottom:20px;
    display: none;

}

p
{
    font-family: "Times New Roman", Times, serif;
    font-size: 20px;

}

p1
{
    color: blueviolet;
}

p1:hover + h1
{
    display: block;
}

我尝试添加 ID,但没有成功

html css css-selectors hover mouseover
1个回答
0
投票

不要使用标签,因为 HTMl 没有任何内置标签。在 css #p1:hover{backgroundcolor:red} 中这可能会解决

© www.soinside.com 2019 - 2024. All rights reserved.