发表于： 2016-02-16 16:44:36
1 1848
今天完成的事情：
任务三完成。切图加布局。效果：
调试在手机上可以正常显示。代码如下，希望师兄有空帮忙检查。不知道有哪些问题：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>task3</title>
<meta name="viewport" content="width=divice-width,initial-scale=1">
<link rel="stylesheet" type="text/css" href="index.css">
</head>
<body>
<div id="top">
<img src="./image/logo1.png">
</div>
<div id="main"><img src="./image/logo4.png"></div>
<div id="word">
葡萄藤轻游戏专注于桌游领域，提供在线杀人游戏、捉鬼、炸狼堡等多种聚会游戏，以下线下桌游道具。
</div>
<div id="bottom">
<img src="./image/logo2.png">
<img src="./image/logo3.png">
</div>
</body>
</html>
@charset "utf-8";
/* CSS Document */
body{
width:100%;
height:100%;
background:#68cdd5;
}
#main
text-align:center;
margin:8%;
}
#word{
font-size:1.5em;
color:#FCFCFC;
text-align:center;
margin:8%;
}
#bottom{
text-align:center;
}
#bottom img{
margin:5%;
}
明天计划的事情：完成task4；
遇到的问题：不知道如何用css控制图片等比例缩小，感觉图有点大了。
收获：盒子模型，margin padding border使用更加熟练，知道了viewport和em这两个自适应。
返回列表
评论