这几天按照京东页面布局样式等做了一个类似的页面，仅仅只是主页。主要的就是css里的布局，接下来就总结一下这几天的知识要点。
1.在html文件里导入css文件、js文件
<link rel="stylesheet" type="text/css" href="文件名.css">
<script type="text/javasrcipt" language="Javascript" src="文件名.js"></script>
其中rel是relationship的缩写，css(cascarding style sheet)级联样式表。
2.在html中，为了方便以后的维护管理，有两个重要的标签<div>和<span>
<div>为块级元素，如果依次在页面中插入，则会一个一个往下排布。
<span>为内联元素，如果依次插入，会在一行排列。内联元素忽略宽和高，其宽高由其内容大小决定。
如果要设置宽高，可使用css设置。（1）display:block;（2）float:left(添加float属性)。
3.float属性在css中被大量使用(可能是因为我现在很多属性应用的不熟练或者不知道其效果)来布局整个页面。
如果要让固定宽高的<div>块居中则css样式要设置div{position:absolute/relative;top:50%;left:50%;margin-left:-1/2height;margin-top:-1/2width;}
这里要插一个clear属性。规定元素哪一侧不允许出现其他浮动元素。clear:both;左右都不可出现浮动元素。
clear属性可用于换行。
4.设置文字在<div>块中居中：div{line-height:height;//垂直居中 text-align:center;//水平居中}
5.在列表中插入竖线的方法小技巧：在列表中在增加一个li列表，设置各项属性。
6.line-height属性：行高。这个在我绘制过程中用的还是比较多的。这里有个要注意的地方。
line-height:150%和line-height:1.5//前者是依据父元素大小计算行高，且子元素的后代也使用这个行高。后者是按子元素大小计算行高。
所以如果子元素有多行，设置line-height:150%通常会产生重叠。
7.letter-spacing属性：字体间距，也可用于列表间的间距。
8. a{text-decoration:none;} a:hover{text-decoration:underline;}
设置鼠标悬停在链接处显示下划线
9.标签页的效果
1 //label1/label2/label3/lable4分别是标签页li元素的对应展示div块id
2 var tabsArray = ["label1","label2","label3","label4"];
3 //obj为标签页元素,index为展示元素块序号,即上面的div块在tabsArray中的序号
4 function showTable(obj,index){
5 //获取父节点(即列表ul)下的每个li元素
6 var liobj = liobj.parentNode.getElementsByTagName("li");
7 for (var i= 0; i<tabsArray.length; i++ ){
8 var tab = document.getElementById(tabsArray[i]);
9 if(index == i){
10 tab.style.display = "block";
11 }
12 else{
13 tab.style.display = "none";
14 }
15 }
16 }
先写这么多吧。希望自己能够坚持下去。