发表于: 2016-04-06 17:58:37
1 1349
今日完成
1.通读了一遍HTML和CSS的基础教程部分;
2.尝试做了九宫格;
3.初步配置了Nginx;
明天计划
1.再次复习HTML&CSS;
2.调试自己做的九宫格
收获
1. 做出了九宫格的雏形!这是给自己最大的鼓励!
2. 了解了div,span,id,class等的基本用法;
3. 对嵌套,布局有了点感觉;
问题
1. 对布局始终还没有入门,没有大局观;
2. 九宫格的细节掌握得不好,很多地方还不明白其原理;
3. 很多属性不熟悉,还要多看HTML和CSS基础;
自己写的代码:
======================================================
<html>
<head>
<style type="text/css">
body{background-color: white;}
#viking{
width: 300px;
height: 300px;
margin: auto;}
.check{
width: 60px;
height: 60px;
padding: 10px;
margin: 5px;
background-color:orange;
border-radius: 10px;
text-align:center;
float:left;
}
p{align: center; font-family: Microsoft Yahei; font-size: 20px;}
</style>
</head>
<body>
<div id="viking">
<div>
<div class="check"><p>我</p></div>
<div class="check"><p>貌</p></div>
<div class="check"><p>似</p></div>
</div>
<div>
<div class="check"><p>做</p></div>
<div class="check"><p>好</p></div>
<div class="check"><p>了</p></div>
</div>
<div>
<div class="check"><p>九</p></div>
<div class="check"><p>宫</p></div>
<div class="check"><p>格</p></div>
</div>
</div>
</body>
</html>
===========================================================
评论