16.7.6

今天做完第二个算是有实际意义上的网站主页，下面总结做该项目过程中遇到的一些问题和解决方法以及一些以后要注意的问题。

1、尽量不要使用标签名作为选择器，即使使用，也要在前面加上一个较小范围的限制，否则会内容一多可能就会影响后面该标签的内容。

2、做一个项目时，把整体的布局规划好之后（尽量不要使用固定宽度的布局，尽量使用流式布局），再对每一section的内容用最见到的方式做到最精致。

3、做一些内容的间隔线的时候可以使用盒子的边框实现，不需要额外加上div单独作为间隔线。

4、可以用css的hover或者focus（一般只用于表单的按钮）属性实现tab选项卡，其关键点在于把要切换的内容包裹在悬停或者获得焦点的盒子中，再用绝对定位改变要切换内容的显示位置，再切换内容的z-index的值。

5、谷歌浏览器可支持的最小字体是12px，即使字体设置再小，也只是显示12px的效果。

6、一些特殊的属性需要在不同的浏览器上加上其特有的前缀，火狐（-moz-）、谷歌（-webkit-）、欧朋（-o-）、ie(-ms-)等，但是一些比较通用的属性就不回用得着前缀，一般就是把前缀的写法写在前面，通用写法写在后面。

7、一般浮动的元素通常写在非浮动元素的前面。

8、overflow：hidden用在父元素中用来清除浮动的原理：是父元素满足了形成bfc的条件，从而不与浮动元素重叠，然后就实现了清除浮动的效果。

9、可以把.bfc{overflow:hidden;}作为一个类置于base.css以便随时给元素挂类减少代码。

以下是做项目过程中的一些不足：

1、没有很好的把握时间，在时间的分配上没有做到游刃有余

2、对于页面的一些效果做的不够理想，例如一些选项卡和鼠标的悬停事件把握得不太到位

3、为了追求某一效果使用了大量的冗余代码，比如在做地铁路线图的时候为了悬停切换站点背景以高亮显示的效果，而使用了超出原本两到三倍该部分的代码

4、选择器的命名上不够清晰可辨。

5、一些bug的解决上耗费过多的精力，没有充分利用好浏览器本身的控制台调试功能，解决bug的能力有待提高

6、做项目的过程中没有进行充分的思考，没有融入自己的思想和特色，在完成需求的基础上要尽可能从用户体验的角度实现个性化特色

7、css代码的书写的顺序不够有条理，代码注释略少，可适量增加注释

8、对知识点的运用还不够灵活，每次设置了一个属性就要看测试结果，效率太低

9、在选择器的使用上也不够灵活，给元素挂上了太多的选择器名，挂一些初始化的类尚可。

由于时间原因，这次就先总结到这里。感谢您的查阅，期待您的宝贵意见！