css制作圣诞树

最新推荐文章于 2023-07-11 17:54:37 发布

weixin_30667649

最新推荐文章于 2023-07-11 17:54:37 发布

阅读量427

点赞数

原文链接：http://www.cnblogs.com/drl937676516/p/3843381.html

版权

没事干，用css画一个圣诞树

<!doctype HTML PUBLIC "-//W3C//DTD HTML 4.01//en" "http://www.w3. org/TR/html4/strict.dtd">
<head>
    <meta name="content-type" content="text/html; charset=utf-8">
    <title>圣诞树</title>
    <style>
        #content{
            height:680px;
            background:black;
        }
/*树叶*/        
        .tri{
            width:0px;
            height:0px;
            border-style:solid;
            border-width:50px;
            border-top-width:0px;
            border-color:green transparent;
            margin:auto;
        }
        .tri1{
            border-width:50px;
            border-top-width:0px;
        }
        .tri2{
            border-width:100px;
            border-top-width:0px;
        }        
        .tri3{
            border-width:150px;
            border-top-width:0px;
        }
/*树干*/
        #rectangle{
            width:90px;
            height:150px;
            background:#CC9900;
            margin:auto;
        }
    </style>
</head>
<body>
    <div id="content">
        <div class="tri tri1"></div>
        <div class="tri tri2"></div>
        <div class="tri tri3"></div>
        <div id="rectangle"></div>
    </div>
</body>

冷静，坚持

转载于:https://www.cnblogs.com/drl937676516/p/3843381.html

weixin_30667649

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
css制作圣诞树

没事干，用css画一个圣诞树<!doctype HTML PUBLIC "-//W3C//DTD HTML 4.01//en" "http://www.w3. org/TR/html4/strict.dtd"><head> <meta name="content-type" content="text/html; charset=utf...
复制链接

扫一扫