用html和css画圣诞树,用python制作圣诞树
圣诞节到了，看了网上各种各样的圣诞树，作为程序员也想用代码做圣诞树，用熟悉做圣诞树页面给朋友html代码doctypehtmlhtmllang= en headmetacharset= utf-8 meta name= author content=法棍圣诞树标题熟悉制作titlelinkRang的headbodypclass= word 圣诞快乐/PDI v class= tree div class= stardivclass-in /div-树叶-div class= leaf-box div class= leaf div class= edge /div div class= edge right /div/div clax div div class= leaf div class= edge right /div/div class= edge right /div/div div class= edge right /div div class= leaf div class= edge /div div class= edge /div div class= edge /div-树干- div class=trunk/div！ -彩色球-div class= ball-box div class= ball B1 /div div class= ball B2 /div div class= ball B3 /div div div class-闪烁-div class= sparkle span/span span/span/span/span/span/div族/div族高度：100%;} * {边距：0;垫：0;}正文{背景色：# 000000；}.word { font-size:60px；文本照明3360中心；颜色：金牌；padding-top:70px；间隔：5pxtext-shadow :2 px4px 9px rgba (255、255、255、0.7)；(/)圣诞树外的div(/.树)宽度：200像素高度：300像素边距：110px自动0自动泼水
选项：相对的；/*相对定xqdfh//* border:1px solid # fff；*/}.star { width:10px；高度：10px位置：绝对；/*背景色：# fff*/边框-半径：50%;top:0px；z指数：1000;左：50%;transform:平移x(-50%)；box-shadow: 0 0 70px 30px rgb(253，253，253)；}.星入{位置：绝对；左：35%;top:70%；右边框：200像素纯色透明；边框-底部：150像素纯金；边框-左侧：200像素纯色透明；变换：平移x(-50%)平移y(-50%)旋转(35度)标度(0.14)；}.星入：前{下边框：140像素纯金；边框-左侧：65像素纯色透明；右边框：65像素纯色透明；位置：绝对；top:-90px；左：-140 px；内容："";变换：旋转(-35度);}.星入：后{下边框：140像素纯金；左边边框：210像素纯色透明；右边框：200像素纯色透明；位置：绝对；top:3px；左：-200 px；内容："";变换：旋转(-70度);}.叶{位置：绝对；左：50%;top:3%；左边距：-30px；背景色：rgba(14，110，14)；宽度：60px高度：60px border-radius:0 10px 35px 10px；变换：旋转(45度);box-shadow: 2px 7px 2px rgba(43，43，43，0.2)；}.边缘{位置：绝对；左：0;底部：0;背景：rgba(14，110，14)；宽度：25px高度：30px border-radius:0 10px 35px 10px；变换：平移y(50%)平移x(0)；}.edge.right{position:绝对；左：未设置；底部：未设置；top:0；右：0;背景：rgba(14，110，14)；宽度：25px高度：30px border-radius:0 10px 35px 10px；变换：平移y(0)平移x(50%)；}/*双数修改背景ykdby/.leaf:n-child(eve){ background-color:# 0f 880 f；}.叶：第n子（夏娃)。边缘{背景色：# 0f 880 f；}/*最上smdrjb/.leaf:n-child(1){ z-index:100；变换：旋转(45度)比例(0.8);}/*第zzdfg/.leaf:n-child(2){ z-index:99；top:15%；变换：旋转(45度)比例(1.3);}.leaf:n-child(3){ z-index:98；top:28%；变换：旋转(45度)比例(1.6);}.leaf:n-child(4){ z-index:97；top:41%；变换：旋转(45度)比例(1.9);}.leaf:n-child(5){ z-index:96；top:54%；变换：旋转(45度)比例(2.2);}.行李箱{宽度：25px高度：45 px border-radius:0 0 3px 3px；位置：绝对；左：50%;转换：平移(-50%);底部：20pxz指数：1;方框阴影：0 0 80px 5px rgb(253，253，253)；背景：线性梯度(0度、#6d411b 0%、# 5a 341d 64%)；}.球宽度：20px高度：20px背景：# f00 box-shadow:-1px-1px 6px inset # 600，1px 1px 8px inset # ffc 9 c 9；边界半径：50%;z指数：101;位置：绝对；} .b1 {左：25%;top:30%；} .b2左：35%;top:50%；} .b3左：65%;top:20%；} .b4左：45%;top:22%；} .b5左：40%;top:72%；} .b6 {左：60%;top:52%；} .b7 {左：50%;top:62%；} .b8 {左：80%;top:42%；} .b9 {左：10%;top:62%；}.b4，b5，b6 {背景：# eccececbox-shadow:-1px-1px 6px inset # 615 f5f，1px 1px 8px inset # fff}.b7，b8，b9 {背景：金色；框-阴影：-1px -1px 6px inset #3a3101，1px 8px inset # fff}。span {显示：块；位置：绝对；字体大小：20pxz指数：101;颜色：# fff动画：火花1.5秒缓解无限交替；}/*闪烁动画*/@关键帧闪耀{0%，100% { transform:scale(1)；} 50% {变换：缩放(1.5);}}.闪耀跨度：第n个孩子(1){左：30%;top:40%；}.闪耀跨度：第n个孩子(2){左：40%;top:27%；字号：15px}。闪耀跨度：第n个孩子(3){左：50%;top:57%；字体大小：12px}。闪耀跨度：第n个孩子(4){左：70%;top:67%；字体大小：14px}。闪耀跨度：第n个孩子(5){左：54%;top:20%；字体大小：20px}。闪耀跨度：第n个孩子(6){左：60%;top:33%；字体大小：20px}。blink div { width:3px；高度：3px背景：# fffz指数：101;位置：绝对；边界半径：50%;动画：眨眼1.5秒缓解无限交替；}.眨眼div:第n-child(2){左：34%；top:13%；变换：缩放(1.2);}.眨眼div:第n-child(3){左：54%；top:43%；变换：缩放(0.6);}.眨眼div:第n-child(4){左：64%；top:33%；变换：缩放(1.4);}.眨眼div:第n-child(5){左：34%；top:63%；变换：缩放(1.8);}.眨眼div:第n-child(6){左：14%；top:76%；变换：缩放(1.5);} @关键帧闪烁{ 0% { box-shadow:0 0 0 # fff；} 25% { box-shadow:0 0 1px 1px # fff；} 50% { box-shadow:0 0 2px 2px # fff；} 75% { box-shadow:0 0 3px 3px # fff；} 100% { box-shadow:0 0 4px 4px # fff；}}效果图
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。