首页圣诞树（HTML）代码

圣诞树（HTML）代码

时间: 2023-12-22 08:29:49 浏览: 55

以下是一个简单的圣诞树的HTML代码示例： ```html <!DOCTYPE html> <html> <head> <title>圣诞树</title> <style> .tree { text-align: center; } .tree:before { content: ""; display: block; width: 0; height: 0; margin: 0 auto; border-left: 50px solid transparent; border-right: 50px solid transparent; border-bottom: 100px solid green; } .tree .tree-top { width: 150px; height: 150px; background-color: brown; margin: 0 auto; border-radius: 50%; } .tree .tree-bottom { width: 200px; height: 200px; background-color: brown; margin: 0 auto; } </style> </head> <body> <div class="tree"> <div class="tree-top"></div> <div class="tree-bottom"></div> </div> </body> </html> ``` 这段代码使用HTML和CSS创建了一个简单的圣诞树。它使用伪元素和背景颜色来绘制树的形状，并使用圆形的div元素作为树的顶部和底部。

阅读全文