posts - 122,  comments - 25,  trackbacks - 0

最近一个项目主要涉及前端的交互优化,由于UED资源不足,所以一起做了一些前端的工作,

由于各浏览器的标准不一样,如要兼容像ie6,7,8firefox,样式调整比较费事,现在css相关

的一些技巧分享一下,希望对大家有所帮助。

 

1、什么是css hack.

针对不同的浏览器去写不同的CSS,让它能够同时兼容不同的浏览器,能在不同的浏览器中也

能得到我们想要的页面效果,这种针对不同的浏览器写不同的CSS code的过程,称之为CSS hack

 

通过下表中的hack code就可以实现不同版本ie浏览器间的兼容:

hack code

ie6

ie7

firefox

_

×

×

*

×

!import

×

‘_’ : 只有ie6能识别_ie7,8”width:100px; “的样式是OK,但ie6不够宽时,可以在”width:100px”后面增加一段”_width:105px;” 那么ie7,8不会解析_width:105px,但ie6会执行。

‘*’ : ie6,7都能识别*,但firefox不能识别;

‘!import’ : ie 6不能识别,ie7ie8都能识别;

 

2css调试工具

(1). ie8的调试工具,ie8下按F12能呼出开发人员开发工具,如下图:

选中图中的箭头鼠标按钮,在浏览器中选中需要优化的HTML对象,HTML窗口就会

定位到选中HTML对象的代码上(如上图左),则右窗口中则显示当前对象的所有样式,

通过对右窗口中的样式调整,达到预期效果后,找到css文件的class,并作相同修

改。通过这个工具,修改样式后所见即所得,确定样式后再修改样式文件。

 

(2). Firebugfirefox下可以通过Firebug工具,来定位HTML对象并调试该对象的样式,如下图:

 

posted on 2010-06-29 11:03 josson 阅读(2165) 评论(0)  编辑  收藏 所属分类: web开发

只有注册用户登录后才能发表评论。


网站导航:
 
<2010年6月>
303112345
6789101112
13141516171819
20212223242526
27282930123
45678910

常用链接

留言簿(3)

随笔分类

随笔档案

收藏夹

搜索

  •  

最新评论

阅读排行榜

评论排行榜