就左上角的那块红色区域需要怎么做啊,无头绪 想请大家帮帮忙
/
猿问
<!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>
举报