猿问
下载APP

用css怎么做一个条纹效果?? 虚心请教

http://img2.mukewang.com/5e8055460001555502020206.jpg

就左上角的那块红色区域需要怎么做啊,无头绪 想请大家帮帮忙

so_bad
浏览 1009回答 1
1回答

第二钢协

<!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>
打开App,查看更多内容
随时随地看视频慕课网APP
我要回答