发表于: 2017-03-02 16:01:34

1 562


今天完成的事:学习了任务一需要学习的一些知识点。看了别人的日报,试着敲了代码,完成如下面代码所示。

明天计划的事情:继续学习,尽量完成任务一的内容。

遇到的问题:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta name="viewport" content="width=device-width,initial-scale=1, maximum-scale=1, user-scalable=no" charset="utf-8"  />

<title>九宫格</title>

<style type="text/css">

*{margin:0;padding:0;}

.box{

padding: 15%;

}

.box div{

    float: left;

    padding: 30% 0 0 0;

    margin: 0 3% 3% 0;

    width: 30%;

    background: orange;

    border-radius: 25px;

}

</style>

</head>

<body>

<div class="box">

<div></div>

    <div></div>

    <div></div>

    <div></div>

    <div></div>

    <div></div>

    <div></div>

    <div></div>

    <div></div>

</div>

</body>

</html>

不太懂 为什么??.box div{ padding:30% 0 0 0;} 高就能和宽一样大  

收获:学会了自适应用%表示,圆角用border-radius属性表示。


返回列表 返回列表
评论

    分享到