软件工程第一次作业
源代码：
<!DverOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>个人简介</title>
<style type="text/css">
body{
margin: 0px;
padding: 0px;
background:url(img/acemaozi.jpg);
background-size: cover;
}
a{text-decoration: none;}
#body{
width: 100%;
height:15%;
border: 3px solid;
background-image:url(img/43a7d933c895d1433c5282f674f082025aaf073a.jpg);
}
#infor{
width: 100%;
height: 20%;
position: relative;
top:10px;
}
#intruduce{
width: 20%;
height: 570%;
border:1px solid;
margin-top: 3%;
}
#character1{
width: 20%;
height: 100%;
position: relative;
margin-top: 100px;
font-size: 25px;
}
#character1 ul{
width: 300px;
height: 40px;
}
#character1 ul li{
list-style: none;
margin-bottom: 20px;
vertical-align: bottom;
}
#character2{
width: 20%;
height: 100%;
position: relative;
margin-top: 10px;
margin-left: 620%;
font-size: 25px;
}
#character2 ul{
width: 400px;
height: 40px;
}
#character2 ul li{
list-style: none;
margin-bottom: 20px;
vertical-align: bottom;
}
#character3{
width: 20%;
height: 100%;
position: relative;
margin-top: 10px;
margin-left: 4220%;
font-size: 25px;
}
#character3 ul{
width: 650px;
height: 10px;
}
#character3 ul li{
list-style: none;
margin-bottom: 20px;
vertical-align: bottom;
}
#photo{
width:100px;
height:100px;
position:relative;
top:10px;
right:-110px;
}
.text1{
font-size:30px;
font-weight:700;
color:dodgerblue;
text-align:center;
font-family:宋体;
position:relative;
margin-top:50px;
}
.text2{
font-size:30px;
font-weight:700;
color:aqua;
text-align:center;
font-family:宋体;
position:relative;
margin-top:100px;
}
.text3{
width:100px;
height:100px;
border-radius:70px;
position:relative;
margin-top:20px;
background:none;
}
.text4{
font-size:30px;
font-weight:700;
color:aqua;
text-align:center;
font-family:宋体;
position:relative;
margin-top:-430px;
margin-left:450px;
}
.text5{
font-size:30px;
font-weight:700;
color:aqua;
text-align:center;
font-family:宋体;
position:relative;
margin-top:-235px;
margin-left:550px;
}
</style>
</head>
<body>
<div id="body">
<div id=infor>
<p class="text1"> 欢 迎 查 看 X X X 个 人 简 介</p>
</div>
<div id="intruduce">
<p class="text2">个 人 简 介</p>
<div id="photo"><input type="image" class="text3" value="" src="img/10.jpg"> </div>
<div id="character1">
<ul>
<li>姓名：沈翎烨</li>
<li>学号：1700802XXX</li>
<li>班级：174班</li>
<li>性别：男</li>
<li>职业：学生</li>
<li>专业：计算机科学与技术</li>
</ul>
<p class="text4">个 人 作 品</p>
<div id="character2">
<ul>
<li>
《无题》</li>
<li>江湖路远歌残篇，风起狂沙遮眉眼</li>
<li>沽酒对饮望斜阳，红尘金戈入肠空</li>
<li>青莲落雨浮萍客，业火浸染山河色</li>
<li>梦是伊人泪满颊，拂袖拭眸尽素容</li>
<li>孤舟蓑笠雨瑟瑟，飞雪寒宫风飒飒</li>
<li>恋是此生为一人，鞕马天涯似飞鸿</li>
<li>鲨齿青锋血盈袖，陌路蹉跎吟狂歌</li>
<li>狱血世豪白发人，纵横捭阖为英雄</li>
<li>文/沈翎烨</li>
</ul>
<p class="text5">兴 趣 爱 好</p>
<div id="character3">
<ul>
<li>爱 好：听 歌 曲，写 文 章，看 动 漫，看电影，古风圈等</li>
<li>喜欢的歌手：河图，少司命，小曲儿，Winky诗，玄觞等</li>
<li>喜欢的动漫：《秦时明月》《天行九歌》《画江湖》《少年歌行》等</li>
<li>喜欢的语录：1）勇敢，不是通过让别人为他担心来证明的，尤其是那些关心他的人；强者，是能够让他的朋友亲人感到安全和放心。——盖聂</li>
<li>2）有些梦想虽然遥不可及，但不是不可能实现。只要我足够的强。——盖聂</li>
<li>3）当一个人的心中有着更高的山峰想去攀登时，他就不会在意脚下的泥沼，他才可能用最平静的方式去面对一般人难以承受的痛苦。——张良</li>
</div>
</div>
</div>
</div>
<embed src="https://v.youku.com/v_show/id_XNjEyMjkxOTk2.html?spm=a2h0k.11417342.soresults.dposter" width="100%" height="950px" autostart='true' loop='true' ></embed>
</div>
</body>
</html>
效果图：
下方放了一个视频！
浙公网安备 33010602011771号