12个需要注意的规范样式写法解决浏览器兼容问题
来源:互联网 发布:python api接口开发 编辑:程序博客网 时间:2024/06/10 16:29
前些日子一直在调兼容性问题 上网的时候发现了几篇不错的帖子,现在转过来给大家分享下
-- 编者的话
浏览器兼容是令很多web前端头痛的一个问题,因为不同浏览器使用内核及所支持的HTML等网页语言标准不同,以及用户客户端的环境不同造成的显示效果不能达到理想效果,对于浏览器兼容问题只有经过不断的调试积累,规范样式代码,才能才能免去一些hack,减少很多额外的工作量。在这里分享下本人从事前端开发以来积累的浏览器兼容经验。--(川也设计-泸州网站制作)
1、IE6 7中一串宽度不固定的A标签在宽度固定的容器中无法自动跳行,而是在最后边被挤成一列,宽度只有一个字符宽,我们可以用span标签包裹A标签,span标签设display:inline-block。
2、IE6 7中绝对定位的元素在没有设置top(bottom)和left(right)的情况下会不受控制,所有必须设置这两个值。
3、span标签在IE6中为设置float属性的时候,会与同行的其他元素上下不对齐,且局左边有一定的间隙,会导致将后面的元素挤出去,另外span最好设置全局属性display为inline-block,这样可以减少一些不必要的调试。
4、label标签是一个很不好控制的标签,我们习惯与将input[checkbox]、input[radio]这两个标签放于label中,方便于点击text文本的时候也能选中,这两个标签在谷歌等中无法与文本水平对齐,我们可以设置float属性,然后就可以设置margin-top,写个hack *margin在IE中为零,就能很好的处理这个问题。
5、右浮动元素,如果同行还有其他元素不设置左浮动,在IE6 7中将会掉到下一行。
6、margin-bottom,在IE6 7中是无效的,所以最好设置padding-bottom,或者下面的元素设置margin-top。
7、ul列表标签中的li设置margin属性的时候在ie6中会被双倍放大,所以最好用padding属性代替间距。
8、input[button]如果不需要边框的话必须设为border:none 0;否则在IE6中还是会显示边框。
9、左图又文字的结构,img标签设置左浮动,p标签可以只设置个padding-left或设置右浮动,否则在IE7中还是会被挤下来。
10、样式注释*/前面加上一个空格隔开,否则在IE6中如果注释字符是奇数个的时候会跟*/解析成另一个字符。
11、截字省略号text-overflow:ellipsis;white-space:nowrap;overflow:hidden; 在Firefox中是不能支持,所以必须设置外围元素的高度。
12、img标签在IE6 7中左右又一个像素的间距,必须给img设置左浮动,img最好设置全局属性display属性为block。
感谢补充指正
原出处www.tranye.com
- 12个需要注意的规范样式写法解决浏览器兼容问题
- 12个需要注意的规范样式写法解决浏览器兼容问题
- 前端开发时需要注意的要点 避免浏览器兼容问题
- 前端开发时需要注意的要点 避免浏览器兼容问题
- 前端开发时需要注意的要点 避免浏览器兼容问题
- 前端开发时需要注意的要点 避免浏览器兼容问题
- 浏览器兼容问题的解决
- 在不同的浏览器使用不同的css样式,解决浏览器兼容问题
- 在不同的浏览器使用不同的css样式,解决浏览器兼容问题
- JavaScript中浏览器兼容问题的写法小议
- 解决 innerHTML的浏览器兼容问题
- 解决多浏览器的兼容问题
- 解决IE7、IE8、火狐样式不兼容问题,Hack写法
- 12种Javascript解决常见浏览器兼容问题的方法
- 12种Javascript解决常见浏览器兼容问题的方法
- 12种Javascript解决常见浏览器兼容问题的方法
- 解决浏览器兼容问题的一个CSS
- 有效解决css不同浏览器的兼容问题
- Eclipse里编写第一个Hadoop程序
- 诡异的楼梯 hdu 1180
- 使用Nexus管理maven仓库,setting文件理解
- android 在ViewGroup中处理触摸事件 [Managing Touch Events in a ViewGroup]
- eclipse hadoop开发环境配置
- 12个需要注意的规范样式写法解决浏览器兼容问题
- 一些概念
- android gallery实例(画廊效果)
- Java学习笔记(类库介绍)
- Linux 内核开发之上路
- 在 MFC 中的 SetFont() 函数的正确使用
- SPOJ 1811 Longest Common Substring(后缀自动机)
- DHCP协议的有限状态机及相关问题
- Rectangle and Circle_hdu_1221(数学几何).java