如何编写一个简单的Web页面上的HTML/CSS圣诞节树装饰代码？

创建一个简单的Web页面上的HTML/CSS圣诞节树装饰，你可以按照以下步骤：

1. **HTML结构**:

   <div class="圣诞树">
     <div class="tree-trunk"></div>
     <div class="tree-cone tree-top"></div>
     <div class="tree-balls">
       <div class="ball ball1"></div>
       <!-- 可添加更多球体，复制相同的结构 -->
     </div>
   </div>

这里定义了一个包含树干、顶部锥形部分以及一些球体的基本结构。

2. **CSS样式**:

   .圣诞树 {
     position: relative;
     width: 400px;
     height: 600px;
     margin: auto;
   }

   .tree-trunk {
     background-color: #795548;
     width: 100px;
     height: 200px;
     position: absolute;
     bottom: -50px;
   }

   .tree-top {
     background-color: #f0e4d6;
     width: 80%;
     height: 50px;
     border-radius: 50% 50% 0 0;
     position: absolute;
     top: 0;
   }

   .tree-balls {
     position: absolute;
     top: 100px;
   }
   
   .ball {
     width: 50px;
     height: 50px;
     border-radius: 50%;
     background-color: #ebebeb;
     /* 使用动画模拟落下 */
     animation: drop-ball 3s infinite;
     transition: transform 0.5s ease-in-out;
   }

   @keyframes drop-ball {
     0% {transform: translateY(0); opacity: 0;}
     50% {opacity: 1;}
     100% {transform: translateY(-100px);}
   }

这段CSS设置了树的外观和动态效果（小球落下）。