请老师检查下代码,谢谢
来源:2-9 自由编程
不厌_
2021-05-27 15:03:19
相关代码:
<!Doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>编程作业</title>
<style>
* {
margin: 0;
padding: 0;
}
.box {
width: 300px;
height: 240px;
margin: 20px auto;
position: relative;
overflow: hidden;
}
.box img {
width: 300px;
height: 240px;
}
.box p {
width: 280px;
height: 50px;
color: white;
padding-left: 20px;
line-height: 50px;
background-color: rgba(96,96,96,.5);
position: absolute;
top: 240px;
transition: top 1s linear 0s;
}
.box:hover p {
top: 190px;
}
</style>
</head>
<body>
<div class="box">
<img src="img/duck.png" alt="">
<p>这是一只小黄鸭</p>
</div>
</body>
</html>
1回答
同学你好,代码实现效果很正确,继续加油,祝学习愉快!
相似问题