css画出桃心(爱心)
思路：创建一个方形div，分别用css控制div的两个伪元素平移到正方形相邻两边，圆形与边中点重合。最后将总的div旋转45度
例子：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> div{ display:inline-block; margin:50px; height: 100px; width: 100px; background-color: red; transform: rotate(-45deg); } div:before,div:after{ display:block; content:""; width: 100px; height: 100px; background-color: red; border-radius: 50%; margin-top:-50%; } div:after{ margin-left:50%; } </style> </style> </head> <body> <div></div> </body> </html> 效果：
原文链接：https://www.qiquanji.com/post/8302.html
本站声明:网站内容来源于网络,如有侵权,请联系我们,我们将及时处理。
微信扫码关注
更新实时通知