就左上角的那块红色区域需要怎么做啊，无头绪 想请大家帮帮忙
1 回答
已采纳
第二钢协
TA贡献34条经验 获得超5个赞
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title></title>
<style>
.box{width: 200px;height: 200px;position: relative;overflow: hidden; /* 超出的部分隐藏 */}
.box img{width: 100%;height: auto;display: block;}
.box .badge{position: absolute;top: 20px;left: -30px;background: red;color: #fff;width: 120px;text-align: center;transform: rotate(-45deg);}
</style>
</head>
<body>
<div class="box">
<div class="badge">ON SALE</div>
<img src="https://cdn.img.wenhairu.com/images/2020/03/30/FPODI.jpg" alt="">
</div>
</body>
</html>
相关问题推荐
添加回答
举报
0/150
提交
取消