当青训营遇上码上掘金

一、主题

本次活动我选择的是“我的名片”这一主题，作为一名程序员，怎么能不会用代码做一张个人名片呢，敲敲代码，做出一张有个性的名片什么的简直太酷了好吧！由于本人比较喜欢简约风，所以就喜欢看上去简洁舒适的个人名片，话不多说，直接上代码！

二、代码展示

由于我目前还是前端菜鸟，所以我只选择了HTML和CSS来进行编写创作，通过多个组合块级元素嵌套，首先在title部分说明这是个人名片，然后在content部分显示个人信息以及个人头像，再加上不同颜色以及阴影，一张简单且简洁的个人名片就完成了，整个编写过程还是很简单轻松的。

介绍一下CSS的部分选择器：

.centered部分是控制名片整体处于屏幕中间

.card部分控制名片正文部分的背景颜色、文字颜色、文字大小、名片阴影等

.card .title部分是关于名片顶部的标题说明栏，控制title部分的背景颜色以及文字大小和颜色等

card .content是控制名片正文内容部分的位置

.card .avatar是控制头像图片的大小、阴影部分以及位置等

整体采用盒子嵌套的方式，代码简单。

本次编写代码时遇到了最大的问题就是，由于第一遍写代码时，几个盒子的名称写的太混乱，导致CSS写选择器时乱七八糟，老出现错误，虽然代码量很少，但是我还是搞糊了，全部重新弄了一遍才理清，因此一定要命名正确且清晰！！！

作为一名前端小白，对JS的使用还不是太熟练，因此名片整体下来不是很好看，不过还是挺简洁的，通过参与这次创作活动，自身编写代码的能力有了进一步提高，也学到了很多，还是得继续加油！