首页生成一段css美化的爱心样式的页面

生成一段css美化的爱心样式的页面

时间: 2023-03-05 08:55:37 浏览: 89

下面是一段使用 CSS 美化爱心样式的页面代码： ``` <!DOCTYPE html> <html> <head> <style> .heart { width: 100px; height: 90px; position: relative; margin: 100px auto; } .heart:before, .heart:after { content: ""; width: 50px; height: 80px; background: red; border-radius: 50% 50% 0; position: absolute; top: 0; left: 25px; 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> ``` 这段代码实现了一个红色爱心形状，宽度为 100px，高度为 90px，并且居中显示在页面中。

阅读全文