当青训营遇上码上掘金 主题1：我的名片

当青训营遇上码上掘金。

主题一：我的名片
名片是向人介绍自我的重要工具，作为一名程序员用代码做自我介绍是一件非常酷炫的事情。请大家围绕“我的名片”这个主题进行代码创作。

熊二的名片

报名参加了第五届前端基础班青训营活动，官方举办了青训营X码上掘金活动来促进我们更好的学习，激发我们的创作热情，所以想借此机会学习新的知识，提高技能。

当看到这个活动时，憨憨熊二一下闪现在我脑海中，当即就决定给熊二做个电子名片。正愁选择什么颜色的背景时，环顾四周看到了桌子上的身份证，“人类有身份证，熊二就没有，我也要给熊二做一个电子身份证”！为了使身份证更真实，我从必应浏览器上下载了身份证样证，收集熊二出生日期、地址等信息。用我那仅有的匮乏的浅薄的html、css知识，做了一个熊二的电子身份证。

html代码

        <div id="left">
            <div id="name">
                熊&nbsp&nbsp二
            </div>
            <div id="two">
                <div id="sex">
                    公
                </div>
                <div id="species">
                    熊
                </div>
            </div>
            <div id="year">
                1999
            </div>
            <div id="month">
                6
            </div>
            <div id="day">
                2
            </div>
            <div id="address">
                黑龙江省大兴安岭狗熊岭树洞
            </div>
        </div>
        <div id="right">
            <img src="https://p1.ssl.qhimg.com/t015e589a00141ca4eb.jpg" width="135px">
        </div>
    </div>

css代码

            background-image: url(https://ts1.cn.mm.bing.net/th/id/R-C.6e5ce14bbb118265faf59179bb85e96d?rik=8EaxPhm1pUBOkQ&riu=http%3a%2f%2fp0.ifengimg.com%2fpmop%2f2018%2f0402%2f59F7AA8D47D76D2A0D9FFCDF453F4D4F7ED99EE2_size83_w480_h604.jpeg&ehk=6H02CVbO%2fafqBfoKPl5lI0pWDSfxDKnlH8nsATb4zQg%3d&risl=&pid=ImgRaw&r=0);
            background-repeat: no-repeat;
            margin: auto;
            width: 480px;
            height: 600px;
        }
        #name {
            margin-top: 347px;
            margin-left: 105px;
            background-color: rgb(200, 216, 224);
            width: 50px;
        }
        #sex {
            background-color: rgb(200, 216, 224);
            margin-left: 105px;
            margin-top: 15px;
            width: 20px;
            float: left;
        }
        #species {
            background-color: rgb(200, 216, 224);
            margin-left: 70px;
            margin-top: 15px;
            width: 18px;
            float: left;
        }
        #year {
            background-color: rgb(200, 216, 224);
            margin-left: 105px;
            margin-top: 10px;
            width: 37px;
            float: left;
        }
        #month {
            background-color: rgb(200, 216, 224);
            margin-left: 27px;
            margin-top: 10px;
            width: 17px;
            float: left;
        }
        #day {
            background-color: rgb(200, 216, 224);
            margin-left: 27px;
            margin-top: 10px;
            width: 17px;
            float: left;
        }
        #two {
            height: 40px;
        }
        #address {
            background-color: rgb(200, 216, 224);
            margin-left: 105px;
            margin-top: 48px;
            width: 183px;
            height: 53px;
        }
        #left{
            width: 295px;
            float: left;
        }
        #right{
            float: left;
            margin-top: 348px;
            margin-left: 5px;
        }

作品

但还是有很多熊二的信息身份证里没地方可以介绍

• 特长：能吃、能睡、嗅觉发达，善于发现食物
• 爱好：吃蜂蜜
• 爱唱的歌：俺是一头大狗熊，大狗熊，大狗熊......
• 荣誉：森林守卫者

因为太菜了，所以即使写一个如此简单粗陋的电子身份证也需要一会儿功夫，期间出现了布局上的问题，思考后加以改正，总结经验，使我收获了很多。也认识到和其他大佬相比我的差距，知识匮乏，技术浅陋，目前正在努力学习JavaScript，希望一个月后的自己有新的突破。