web前端入门积累

1.要兼容IE6，所以尽量不要使用float，用绝对定位或者相对定位就可以了
2.而且当子元素要设定为absolute的时候，父元素要设定relative才可以;
position：absolute这个是绝对定位；
是相对于浏览器的定位

position：relative是相对定位，是相对于前面的容器定位的。这个时候不能用top left在定位。应该用margin。
3.在这里先加载的意思就是把right写在前面的div，left写在后面的div

4.如果想为元素设置层模型中的绝对定位，需要设置position:absolute(表示绝对定位)，这条语句的作用将元素从文档流中拖出来，
然后使用left、right、top、bottom属性相对于其最接近的一个具有定位属性的父包含块进行绝对定位。如果不存在这样的包含块，则相对于body元素，即相对于浏览器窗口。

5.如果想为元素设置层模型中的相对定位，需要设置position:relative（表示相对定位），它通过left、right、top、bottom属性
确定元素在正常文档流中的偏移位置。相对定位完成的过程是首先按static(float)方式生成一个元素(并且元素像层一样浮动了起来)，
然后相对于以前的位置移动，移动的方向和幅度由left、right、top、bottom属性确定，偏移前的位置保留不动。

6.导航条

通常用无序列表构建
水平导航需要设置float属性
菜单样式通过往a标签贴图的形式完成
二级菜单可用overflow:hidden先隐藏再设置可见（visible）基本清除样式：*{margin:0;padding:0;}无序列表圆点清除：ul{list-style:none;}文字下划线去除：a{text-decoration:none;}文本缩进标签 text-indent 不会影响总体宽度（padding会）需要将a标签设置为块元素，才能设高宽、hover效果 代码：a{display:block}hover格式 a:hover{}

菜单<li>浮动后，<li>脱离文档流，导致<ul>将失去高度和宽度；如果需要对<ul>进行整体背景设置，首先要给<ul>定义宽、高先
7.
块级元素特点：<div>、 <p>、<h1>、<form>、<ul> 和 <li>
1、每个块级元素都从新的一行开始，并且其后的元素也另起一行。（真霸道，一个块级元素独占一行）
2、元素的高度、宽度、行高以及顶和底边距都可设置。
3、元素宽度在不设置的情况下，是它本身父容器的100%（和父元素的宽度一致），除非设定一个宽度。

内联元素特点：<span>、<a>、<label>、 <strong> 和<em>
1、和其他元素都在一行上；
2、元素的高度、宽度及顶部和底部边距不可设置；
3、元素的宽度就是它包含的文字或图片的宽度，不可改变。

inline-block 元素特点：<img>、<input>标签就是这种内联块状标签
1、和其他元素都在一行上；
2、元素的高度、宽度、行高以及顶和底边距都可设置。