静态页面项目总结

一、弹性盒子应用注意事项

在使用弹性盒子进行hover划过事件或者导航栏有下拉显示框时，会出现弹动的现象即表现为有弹性，可以利用设置IE盒子这一属性来消除或弱化这一现象，如果不能消除，那便放弃使用弹性盒子然后利用定位来完成排列组合；设置了弹性盒子该属性之后父级的高度会呈现失效的状态，在使用过程中加以注意。

二、hover划过事件之选择器与选择器的结合

hover划过事件是一个伪类选择器，而当要编写一个hover并作用于另外一个标签时，此时是伪类选择器与后代选择器或是兄弟选择器的结合，是选择器与选择器的结合使用，并不是单纯的类名或者元素标签的结合。

三、z-index设置层级必须拥有定位属性

在需要给某一元素设定层级的时候，必须设置定位属性，否则不起作用；
注意：
1、（1）z-index的默认值是0，同级元素取值越大，定位元素在层叠元素中越靠上；
（2）父子元素比较，父元素z-index不会起作用，子元素在z-index正负值上才会与父元素产生层叠效果。
（3）不同父元素且父元素设置z-index情况下，子元素依照自己父元素的z-index发生层叠（即“拼爹”）。
（4）在上一条情况的基础上，修改子元素的z-index只会影响该子元素的层叠效果，对父元素不产生影响。
（5）同样在（3）的情况下，为子元素z-index设置负值，那他们就都会被父元素覆盖掉。
2、如果取值相同，根据书写顺序，后来者居上。
3、数字后面不能加单位。
4、只有相对定位，绝对定位，固定定位有此属性，其余标准流，浮动，静态定位都无此属性。

四、固定定位使用小结

使用固定定位这一属性定义网页元素的时候，相对的父级或者参照物是浏览器窗口；当position属性设置为fixed时，即将元素设定为固定定位，这一属性脱离普通文档流存在，所以设定后，它将始终显示于固定的位置，不随浏览器窗口变化而变化，也不随浏览器滚动条而改变位置。
脱离文档流：fixed，absolute；

五、注意在普通的文档流中的层叠，遮盖关系

在分析划过显示事件的时候应注意普通流的遮盖层叠，如若有必要，须得灵活加以利用，不得一味依赖z-index层级属性，详细分析，理清架构。

六、不要过度依赖于使用div

在搭建结构的时候，div固然好用，不得过度依赖，排列组合方面也可使用无序列表（将小圆点去掉）以达到整齐划一的效果。

<ul>
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
......
</ul>

1. <ul></ul>中只能嵌套<li></li>，直接在<ul></ul>标签中输入其他标签或者文字的做法是不被允许的。
2. <li>与</li>之间相当于一个容器，可以容纳所有元素。
3. 无序列表会带有自己样式属性，放下那个样式，一会让CSS来！

七、提高代码可读性，提升代码优化力度，减少代码的繁杂与冗余，分清架构，认识清晰，剖析合理到位以达到准确高效的操作

分析元素结构的时候解析更清晰，尽量降低代码的繁琐性，提高可读性和可应用性。

八、善于用注释进行通俗易懂且语义化的解释，增加记忆留存性

多用注释进行语义化的注解，方便理解和观赏，多提高代码书写的整齐度和规范程度，给人以清晰明了，一目了然的状态。

九、多总结，多反思，多钻研，多记多练，出错及时改正以保不再犯

总结错误，失误，操作过程中的重难点，记录并琢磨清楚，及时消化并熟记易错点和重难点，以保不再犯。