自学前端第三天
程序员文章站
2022-05-29 12:40:52
简历第三天 简历的CSS文件 简历的html 今天效果图 今天学习到的内容 ......
简历第三天
简历的css文件
body{
font-family: 'franklin gothic medium', 'arial narrow', arial, sans-serif;
font-size: 18px;
font-weight: bold;
color:white;
text-shadow: 4px 4px 4px #222222;
text-align:center;
width:1366px;
height: 768px;
background-image:url("o_xxx.jpg");
background-size: 1366px 768px
}
#header{
background: rgb(238, 223, 16);
margin: 0 40%;
border-radius: 0px 10px 0px 10px;
}
#info{
text-align: left;
}
.name,.age,.sex,.education_background{
background: #b1a1a1;
width: 150px;
border-radius: 0 50% 50% 0 ;
}
.name{
margin: 10px 0 10px 5%
}
.sex{
margin:10px 0 10px 10%
}
.age{
margin:10px 0 10px 15%
}
.education_background{
margin:10px 0 10px 20%
}
#work_experience{
text-align: left
}
.headline{
margin:10px 0 10px 25%
}
.working_time{
margin:10px 0 10px 20%
}
.working_time{
margin:10px 0 10px 20%
}
.company_name{
margin:10px 0 10px 15%
}
.profession{
margin:10px 0 10px 10%
}
.saraly{
margin:10px 0 10px 5%
}
#capacity div{
padding: 8px 10%;
float: left;
list-style: none;
color:#fff;
}
简历的html
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>个人简历</title>
<link rel="stylesheet" href="my_stype.css">
</head>
<body>
<section id="header">小小咸鱼的个人资料</section>
<section id="info">
<div class="name">姓名：yang</div>
<div class="sex">性别：男</div>
<div class="age">年龄：25</div>
<div class="education_background">学历：大专</div>
</section>
<section id="work_experience">
<div class="headline">工作经历</div>
<div class="working_time ">工作时间：2017.5-2019.4</div>
<div class="company_name">公司名称：浙*x医疗科技有限公司</div>
<div class="profession">岗位：qc工程师</div>
<div class="saraly">工资：8k</div>
</section>
<section id = 'capacity'>
<div style="color: black"><b>拥有证书</b>
<br>内审员
<br>化验员
<br>无菌实验员
<br>压力容器操作员
<br>危化品管理员
</div>
<div div style="color: black"><b>计算机软件熟练度</b>
<br>wps:精通
<br>ps:精通
<br>会声会影：精通
<br>ai:熟练
<br>pycharm:熟练
<br>vs:熟练
<br>ae:了解
</div>
</section>
</body>
</html>
今天效果图
今天学习到的内容
#再导入背景为图片时候
格式为background -image:url("xx")这里链接要有双引号
#样式设定时候
好几类设置相同格式化的时候
比如name和age一起设置
可以.age,.name{样式内容}
#关于padding，margin等有4个值要设置的时候
只设置一个默认4个值都是这个，设置两个前面一个代表上下，后面那个代表左右，设置3个默认最后一个为0
#关于样式设置可以直接在标签里设置
<div div style="color: black">如上面的
未完待续