1.实现图
2.代码实现
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> .box { width:50%; height: 300px; margin: 0 auto; } .box2 { position: relative; width: 100%; height: 300px; overflow: hidden; background-color: #eee; } .box2:before{ content: ''; position: absolute; top: 0; left: 0px; display: block; width: 100%; height: 20px; background-size: 40px 40px; background-color: #D96F2B; background-position: 100% 50%; background-image: radial-gradient(closest-side, transparent 60%, #f0f0f0 25%), radial-gradient(closest-side, transparent 60%, #f0f0f0 25%); } </style> </head> <body> <div class='box'> <div class='box2'></div> </div> </body> </html>