サマリー：<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>留言</title> <style> .div1{ position:absolute; right: 0px; width:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>留言</title>
<style>
.div1{
position:absolute;
right: 0px;
width: 80px;
height:80px;
font-size:50px;
text-align: center;
font-weight: bold;
font-family: 楷體;
border:2px solid #FFE4E1;
box-shadow: 5px 5px 15px #FFE4E1;
}
.div2{
display: none;
width:40px;
height:400px;
font-size:24px;
position:absolute;
right:400px;
top:40px;
font-weight: bold;
border:2px solid #eeeeee;
box-shadow: 5px 5px 15px #F0FFF0;
padding:10px;
}
.div3{
display: none;
width:40px;
height:400px;
font-size:24px;
position:absolute;
right:200px;
top:40px;
font-weight: bold;
border:2px solid #eeeeee;
box-shadow: 5px 5px 15px #F0FFF0;
padding:10px;
}
.box{
position: relative;
width: 600px;
height: 500px;
line-height: 80px;
font-size: 18px;
border:2px solid #FFD39B;
box-shadow: 5px 5px 20px #FFD39B;
margin:200px auto;
}
.div1:hover .div2{display:block;cursor:pointer; }
.div1:hover .div3{display:block;}
/*問：.div:hover能不能同時控制.div2和.div3*/
</style>
</head>
<body>
<div class="box">
<div class="div1" value="">戳
<div class="div2">人生如逆旅</div>
<div class="div3">我亦是行人</div>
</div>
</div>
</body>
</html>
添削の先生：天蓬老師添削時間：2019-04-12 16:56:24
先生のまとめ：/*問：.div:hover能不能同時控制.div2和.div3*/
你可以給這幾個div . 添加統(tǒng)一的class, 然后針對這個class來設(shè)置樣式, 實現(xiàn)批量定義