<style type = "text/css">
.privacycheck2:hover {
background-color: #E60000;
width: 100px;
left: 860px;
position: relative;
}
.privacycheck2 {
position: relative;
top: 225px;
left: 852px;
font-family: Helvetica Neue;
font-size: 19px;
color: white;
}
.privacycheck1 {
position: relative;
top: 265px;
background-color: #E60000;
width: 24px;
height: 24px;
left: 843px;
border-radius: 50px;
border: 5px #E60000;
}
</style>
<body>
<div class = "privacycheck2:hover">This information is private</div>
<div class = "privacycheck1"></div>
<div class = "privacycheck2">i</div>
</body>
如果您将鼠标悬停到 privacycheck1 上，我该怎么做，它将在 privacycheck1 旁边显示一个框，上面写着“此信息是私有(private)信息“
当您将 hover 悬停在 privacycheck1 上时，我编写的代码也会让 privacycheck2(“我”)移动，而我不会移动不希望发生这种情况。
最佳答案
如果我正确理解你的问题，你可以做这样的事情，尽管你必须重写你的 HTML。
.privacycheck1 {
position: relative;
background-color: #E60000;
width: 24px;
height: 24px;
border-radius: 50px;
border: 5px #E60000;
}
.privacycheck1::before {
content: 'i';
position: relative;
display: block;
height: 20px;
width: 200px;
left: 30px;
}
.privacycheck1:hover::before {
content: 'This information is private';
}<div class="privacycheck1"></div>关于javascript - 如何使用:hover to show another box next to it's parent，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/33219810/