gpt4 book ai didi

html - 一次为 :hover 选择 2 个元素

转载 作者:行者123 更新时间:2023-11-28 04:45:39 24 4
gpt4 key购买 nike

<!DOCTYPE html>
<html lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">

<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">

<!-- Raleway CSS -->
<link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet">

<!-- CSS File Connection -->
<link rel="stylesheet" type="text/css" href="CSS/styles.css">

</head>

<body>
<!-- Info for JQuery & Windows Configuery.js"></script>
<!-- Bootstrap JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<script src="Hello World"></script>
<div class="header">
<ul>
<div class="row">
<div class="col-md-2">
<li>Home</li>
</div>

<div class="col-md-2">
<li>Information</li>
</div>

<div class="col-md-2">
<li>History</li>
</div>

<div class="col-md-2">
<li>Testimonies</li>
</div>

<div class="col-md-2">
<li>Contact</li>
</div>

<div class="col-md-2">
<li>BOOK US</li>
</div>

</div>
</ul>
</div>

</body>

</html>

您好!我一直想知道如何为 CSS 一次选择两个元素。我想让它们改变颜色悬停,虽然我知道如何使用 :hover ,但我陷入了困境。我希望我的 col-md-2 div 和我的 li 在悬停时改变颜色。我知道变色属性,现在,将鼠标悬停在列表项上的单词上将更改列表项和 col-md-2 的颜色。当悬停在单词周围的空间上时,它会更改两侧的颜色(col-md-2 的额外间距所在的位置),但不会更改列表项中单词后面的颜色。我需要一次更改 2 个元素的颜色。我将如何一次选择 2 个元素以希望通过我的 CSS 同时影响这两个元素?最好不要使用任何 JQuery 或任何类似的东西。使用当今的标准、HTML5、CSS3、最新版本的 Bootstrap。

最佳答案

使用 col-md-2:hovercol-md-2:hover li 来改变这两个元素的样式。

.col-md-2:hover{
background-color:red;
color:blue;
}
.col-md-2:hover li{
color:green;
}

But please Use li inside ol or ul tag. Because it is the recommended syntax of using li element

关于html - 一次为 :hover 选择 2 个元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40982833/

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