1、样式初置
body,div,ul,ol,h1,h2,h3,h4,h5,p,form,input,textarea,select{margin:0;padding:0;}
li{list-style:none;}
a{text-decoration:none;}
img{border:none;vertical-align:top;}
input,textarea{outline:none;}
textarea{resize:none;overflow:auto;}
body{font-size:12px;font-family:”微软雅黑”；}
2、准备工作
*链接css
<link href=”css/style.css” rel=”stylesheet” type=”text/css”/>
*图标制作
PNG图片—转换成ico格式
<link href=”img/100du.ico” rel=”shortcut icon”/>
*jq的导入
<script src=”js/jquery-1.11.0.min.js”></script>
3、区域划分
一般分为下面五个方面
header
nav
search
content 又分为 main、side
footer
4、css
公共区域
.fl{float:left;}
.fr{float:right;}
.clear{zoom:1};//给父级清除浮动
.clear:after{content:‘’,display:block;clear:both;}
不小心插入border-radius: 1 2 3 4 个角//ie 6 7 8不支持此圆角
1、搜索区域
<div id=”header”>
<div class=”search”>
<form>
<input class=”text” type=”text”/>
<input class=”btn” type=”button”/>
</form>
</div>
</div>
.search{width:200px;height:30px;;position:absolute;}
.search .text{width:150px;height:30px;position:absolute;top:0;left:0;}
//将写文本的这个定位到父级的最左边
.search .btn{width:50px;height:30px;position:absolute;top:0;right:0;}
//将按钮定位到父级的最右边
#header .search{top:;left:;}//将这个search定位到某个位置
form不加定位
此处三层定位
2、一段话的那种，用p标签，不用标记行高，只要知道字体、大小等信息，然后定位到某个地方就行
最近在写页面，准备面试的东西。。不考虑很多东西，但写起来还是有点困难，打算一天一个小页面！