发表于： 2017-04-16 22:41:35
2 734
今天制作了动态九宫格。
明天接着做下个任务：学习必备开发任务。
遇到的问题：制作中padding取值为2的时候就溢出，padding="1"时可以并排放三个方块，没有溢出。才开始不知从哪下手，后来从网上搜九宫格，然后模仿出来的。
收获：学会了九宫格动态制作，对padding和margin的动态设置增加了熟悉度。
今天的制作：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>任务一九宫格</title>
<style type="text/css">
.box{margin:0 auto;}
.piece{padding:15%;margin:1.6%;background-color:orange;border-radius:10%;float:left;}
</style>
</head>
<body>
<div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</div>
</body>
</html>
返回列表
评论