https://v4.bootcss.com/docs/components/dropdowns/ 有类似的
Bootstrap3 没有这种布局 但是4有
我想要这样css的代码
我调了几遍,但总是调不出来
你不会用Bootstrap 么?
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css" >
.list{
width: 100px;
height: 40px;
background-color: blue;
border: 1px solid #fff;
color: #fff;
text-align: center;
line-height: 40px;
position: relative;
}
.list:hover .items{
display: block;
}
.item{
width: 100px;
height: 40px;
background-color: blue;
border: 1px solid #fff;
color: #fff;
text-align: center;
line-height: 40px;
}
.item:hover{
background-color: yellow;
color: #000;
}
.items{
display: none;
position: absolute;
top: 0px;
left: 100px;
}
</style>
</head>
<body>
<div style="margin: 50px;" >
<div class="list" >
a
<div class="items" >
<div class="item" >a1</div>
<div class="item" >a2</div>
<div class="item" >a3</div>
</div>
</div>
<div class="list" >
b
<div class="items" >
<div class="item" >b1</div>
<div class="item" >b2</div>
<div class="item" >b3</div>
</div>
</div>
<div class="list" >
c
<div class="items" >
<div class="item" >c1</div>
<div class="item" >c2</div>
<div class="item" >c3</div>
</div>
</div>
</div>
</body>
</html>