发表于： 2016-02-05 11:19:21
1 1474
先把任务内容看了一遍，在W3C回顾了一下html和css的基础知识,然后开始写代码，
代码如下：
<!DOCTYPE html >
<html>
<head>
<meta charset=utf-8" />
<title>jgg</title>
<style type="text/css">
*{border-radius:15px;float:left;}
.all{width:400px;height: 400px;background-color:white;border:solid 1px #666;}
.one,.two,.three,.four,.five,.six,.seven,.eight,.nine{ width:117px;height:117px;background-color:#E8830D; }
.one{ margin-left: 20px;margin-top:20px;}
.two{ margin-left: 5px;margin-top:20px; }
.three{ margin-left: 5px;margin-top:20px; }
.four{ margin-left: 20px;margin-top:5px; }
.five{ margin-left: 5px;margin-top:5px; }
.six{ margin-left:5px;margin-top:5px; }
.seven{margin-left: 20px;margin-top:5px;margin-bottom:20px; }
.eight{ margin-left: 5px;margin-top:5px;margin-bottom:20px; }
.nine{ margin-left: 5px;margin-top:5px; }
</style>
</head>
<body>
<div align="center" class="all">
<div class="one"></div>
<div class="two"></div>
<div class="three"></div>
<div class="four"></div>
<div class="five"></div>
<div class="six"></div>
<div class="seven"></div>
<div class="eight"></div>
<div class="nine"></div>
</div>
</body>
</html>
代码太乱，写完结果截图：
为方便查看各属性位置，加了一边框，对各版面排版掌握的还不透彻，所以在编写过程中出现很多
问题：
1、.six和.nine的float：right，margin-left：5px；最后就造成了这两个块浮动到下面。关于细节我还是不知道他为什么会这样，关于float的一些属性了解的还不透彻
2、设置颜色时，用color属性不显示颜色，用background属性就会显示，关于这些细节问题还是会不透彻，我不知道怎样求助各位前辈啊，谁能教教我
，各位前辈求教！
安利一软件，FSC Capture（屏幕量尺，各种截图，取色等功能）
配置安装nginx，根据安装教程，错误的安装成了linux版本的，后来经学长提醒，重新下载为windows版本。
关于圆角:
运用的是radius属性，通过上网百度资料了解到
radius的用法：http://www.w3school.com.cn/cssref/pr_border-radius.asp
刚开始测试的时候，无论在哪个浏览器或者dw里面都显示不出来，后来不知道再怎么回事又好了，谁能告诉我，我有好多为什么啊
目前遇到最大的困难就是viewport了，再查查资料吧，最近几天有点事也没来得及写报告，
欢迎各位大神老大前来指导批评教育，绝对虚心接受！！
返回列表
评论