发表于: 2016-10-26 20:46:25
2 684
今天完成任务三
明天开始任务四
开始思路很混乱,借鉴他人后有了思路
今天学会了调整字体和居中
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>task3</title>
<style>
body{
width:100%;
margin:0;
padding:0;
color:white;
background-color:#68cdd5;
}
.header{
width:100%;
height:auto;
background-color:#22292c ;
overflow: hidden;
}
#back1{
float:left;
width:30%;
}
#mojing{
float:left;
width:40%;
text-align:center;
font-size:2.0em;
line-height:2.0em;
}
#menue{
float:right;
width:30%;
text-align: right;
}
.content{
text-align: center;
font-size: 1.5em;
margin:0 12%
}
#left{
width: 50%;
float: left;
margin:7% 0;
}
#right{
width: 50%;
float: right;
margin:7% 0;
}
</style>
</head>
<body>
<div class="header">
<div id="back1">
<img src="../images/back1.png">
</div>
<div id="mojing">魔镜</div>
<div id="menue">
<img src="../images/menue.png">
</div>
</div>
<div>
<div>
<img src="../images/back2.png">
</div>
<div class="content">
<img src="../images/logo.png">
</div>
<div class="content">
<p> 葡萄藤轻游戏专注于桌游领域,提供在线杀人游戏,捉鬼,炸狼堡等多种聚会游戏,以下线下聚会桌游道具。</p>
</div>
</div>
<div class="content">
<div id="left">
<img src="../images/left.png">
</div>
<div id="right">
<img src="../images/right.png">
</div>
</div>
</body>
</html>
评论