首页用html写一个爱心的代码

用html写一个爱心的代码

时间: 2023-08-02 14:18:14 浏览: 46

爱心代码.HTML.html

好的，以下是一个简单的HTML代码来绘制一个爱心图案： ```html <!DOCTYPE html> <html> <head> <title>爱心</title> <style> .heart { position: relative; width: 100px; height: 90px; transform: rotate(45deg); margin: 50px; box-shadow: -5px 5px 5px rgba(0,0,0,0.1); } .heart:before, .heart:after { position: absolute; content: ""; left: 50px; top: 0; width: 50px; height: 80px; background: red; border-radius: 50px 50px 0 0; transform: rotate(-45deg); transform-origin: 0 100%; } .heart:after { left: 0; transform: rotate(45deg); transform-origin: 100% 100%; } </style> </head> <body> <div class="heart"></div> </body> </html> ``` 你可以将上述代码复制到一个HTML文件中，然后在浏览器中打开该文件，即可看到绘制的爱心图案。

阅读全文