【项目总结】达能益力官网 windrainpy

css类:

1、设置flash、div、img等元素的层次关系,方法是:position:rela;z-room:3;需要注意层的比较要在同级上来说的。

2、对于表单元素,用其他的定位方法很难达到各大浏览器很好兼容。最好的方法还是绝对定位每个元素。

3、submenu位置实现图片“轮换”功能。一个<a>插入两张img,css控制其鼠标移上和移开的display状态。

4、三级导航那里还可以优化一下,鼠标移上的背景图用同一张png半透明实现,整条tab采用一张背景图就好了,避免loading的时候有图片出现不同步的状况。

5、记住一些属性的缩写,减少代码量,注意background、border、font、margin、padding等等的缩写。灵活运用,至于在内文中的padding和margin设置不必拘泥于设计稿的像素值,差不多就好,更重要的是达到一致性,就取一个比较易记的整数值吧。

6、表单中的输入框要设置背景图的时候不要在input本身设置,要在外面包一个层,在外面层设置背景图。

js类:

1、首页flash全页面在不同分辨率的自适应方法,不出现滚动条。

2、怎么实现右侧返回顶部的活动按钮。研究其js实现原理。

3、点击功能按钮改变字号。JQ来写。

4、视频播放器在页面的运用,注意视频的尺寸?还有播放器调用的视频连接?怎么传参数?和页面上不同视频的切换?

5、怎么实现点击不同的文字侧边对应显示不同的图片?

6、怎么实现点击标题出现对应的内容

7、怎样在输入框中显示默认提示的文字,获取焦点之后消失,失去焦点之后重新出现文字?

琐碎:
1、png图片的输出值为8和24时的差别。除了ie6的半透明可以用ddpng插件实现兼容png-24以外,折中的方法就是让圆角类去掉半透明的像素。(IE6不支持png-24半透明,但是支持png-8完全透明。)

另外

设计类/体验类: 

1、整个画面突出视觉冲击的部分,首页的设计除了表达了益力水对人体的健康成分和特点以外,还在页面小图里面的每个细节上加入了每个栏目的二级导航甚至三级导航里的内容页。

原文地址:https://www.cnblogs.com/windrainpy/p/2093936.html