马上注册，结交更多好友，享用更多功能^_^
您需要 登录 才可以下载或查看，没有账号？立即注册
x
为什么我的喜剧的标题会空出来一些位置，而其他的没什么变化啊？<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>实验四</title>
<style>
.box1 {
margin: 0 auto;
width: 900px;
border-bottom: double lightpink 5px;
}
.box1 span {
display: block;
float: right;
font-size: 25px;
margin-top: 10px;
margin-right: 10px;
}
.box2 {
width: 900px;
height: 400px;
margin: 5px auto;
}
.box2 img {
width: 900px;
height: 400px;
}
.box2 #box2 {
border-radius: 50%;
width: 50px;
height: 50px;
display: flex;
justify-content: center;
align-items: center;
background: rgba(50, 34, 15, 0.5);
position: relative;
bottom: 225px;
}
.box2 span {
font-size: 20px;
color: white;
}
.box2-1 {
float: left;
}
.box2-2 {
float: right;
}
.box2-3 {
width: 100px;
display: flex;
justify-content: space-around;
}
.box2-3 div {
width: 20px;
height: 20px;
border-radius: 50%;
background-color: white;
display: flex;
justify-content: center;
align-items: center;
position: relative;
bottom: 50px;
left: 325px;
margin-left: 2px;
margin-right: 1px;
}
.box3 {
width: 900px;
margin: 25px auto;
border-top: dotted gray 3px;
}
.box3-1 {
display: flex;
justify-content: space-between;
}
.box3-1 img {
width: 140px;
}
</style>
</head>
<body>
<div class="box1">
<img src="images/logo.jpg" alt="图片显示错误">
<span><b>登录 | 注册</b></span>
</div>
<div class="box2">
<a href="video/myVideo.mp4" target="blank"><img src="images/tuijian/tuijian-1.jpg" alt="图片无法显示"></a>
<div class="box2-1" id="box2"><span><</span></div>
<div class="box2-2" id="box2"><span>></span></div>
<div class="box2-3">
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>
</div>
</div>
<div class="box3">
<h1>喜剧>></h1>
<div class="box3-1">
<img src="images/xiju/xiju-1.png">
<img src="images/xiju/xiju-2.png">
<img src="images/xiju/xiju-3.png">
<img src="images/xiju/xiju-4.png">
<img src="images/xiju/xiju-5.png">
<img src="images/xiju/xiju-6.png">
</div>
</div>
<div class="box3">
<h1>动画>></h1>
<div class="box3-1">
<img src="images/donghua/donghua-1.png">
<img src="images/donghua/donghua-2.png">
<img src="images/donghua/donghua-3.png">
<img src="images/donghua/donghua-4.png">
<img src="images/donghua/donghua-5.png">
<img src="images/donghua/donghua-6.png">
</div>
</div>
<div class="box3">
<h1>动作>></h1>
<div class="box3-1">
<img src="images/dongzuo/dongzuo-1.png">
<img src="images/dongzuo/dongzuo-2.png">
<img src="images/dongzuo/dongzuo-3.png">
<img src="images/dongzuo/dongzuo-4.png">
<img src="images/dongzuo/dongzuo-5.png">
<img src="images/dongzuo/dongzuo-6.png">
</div>
</div>
</body>
</html>
| 
( 粤ICP备18085999号-1 | 粤公网安备 44051102000585号)
狗仔卡
发表于 2020-11-6 21:49:39
置顶卡
千斤顶
显身卡
楼主
发表于 2020-11-13 11:08:21
