clipping-2.html 581 B

12345678910111213141516171819202122232425262728293031
  1. <!doctype html>
  2. <html><head>
  3. <title>Border clipping</title>
  4. <style>
  5. .div1 { width: 50px; height: 50px;
  6. border: 4px dotted black;
  7. border-radius: 10px;
  8. position: fixed;
  9. background: red;
  10. left: 50px;
  11. top: 50px;
  12. background-clip: padding-box;
  13. }
  14. .div2 { width: 50px; height: 50px;
  15. border: 4px dotted black;
  16. border-radius: 10px;
  17. position: fixed;
  18. background: red;
  19. left: 50px;
  20. top: 140px;
  21. background-clip: border-box;
  22. }
  23. </style>
  24. </head>
  25. <body>
  26. <div class="div1"/>
  27. <div class="div2"/>
  28. </body></html>