当青训营遇上码上掘金-我的名片

64 阅读2分钟

当青训营遇上码上掘金,我选择的题目是:我的名片,很高兴能参加这次主题创作活动,下面是我的介绍。

题目内容:

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

实现思路:

因为本次的题目是名片的制作,所以我首先想到的是css的盒子模型,在CSS中,盒子模型的内容至关重要,网页内容往往以块的形式出现,而盒模型则是针对块的一种模型结构。

通过css的盒子模型实现个人名片,通常会让个人名片往往显得更加简洁得体,可以有效传播信息,好的布局和背景设置是很重要的。

在本次名片设计中,通过给定css的盒子模型给出内边距padding,外边距margin,边框border,将网页结构模块化,对块及内容进行设置。

使用绝对布局的方式,使得布局相对可控,让整个名片更加完整,漂亮。

同时在css代码中要学会灵活运用选择器代替类名,让代码更简洁可读一些。

 

具体效果,如图所示:

image.png

代码:

`

名片展示
</head>
<body>
	<div id="d1">
		<p id="p1">青训营学员</p>
		<div id="d3">贾亚赛</div>
		<div id="d2"></div>
 
		<div>
    <span>----------------------------------</span>

    <p id="p2">邮箱:jyasai@qq.com</p>
    <p id="p3">电话:19832586253</p>
   
		
		</div>
	</div>

</body>
`   ## 总结: 通过这次主题活动,我学到了很多css的相关知识,让我的技能更加全面,由于目前刚刚接触前端的相关知识,所以本次的名片设计还不算尽善尽美,希望可以通过在青训营中后面的学习可以掌握更多知识和技能。