前端开发如何处理浏览器兼容问题（前端程序员总结的工作中常用的十大浏览器兼容性问题）

前端兼容性问题四：clear:both;

不想受到float浮动的，就在div中写入clear:both;

前端兼容性问题五：居中问题

div里的内容，IE默认为居中，而Firefox默认为左对齐，可以尝试增加代码margin: 0 auto;

前端兼容性问题六：列表类

• ul标签在FF中默认是有 padding值的，而在IE中只有margin有值先定义 ul {margin:0;padding:0;}

• ul和ol列表缩进问题消除ul、ol等列表的缩进时，样式应写成:{list-style:none;margin:0px;padding:0px;}

前端兼容性问题七：显示类（display:block,inline）

1. display:block,inline两个元素

display:block; //可以为内嵌元素模拟为块元素

display:inline; //实现同一行排列的的效果

display:table; //for FF,模拟table的效果

display:block 块元素，元素的特点是：

总是在新行上开始；高度，行高以及顶和底边距都可控制；宽度缺省是它的容器的100%，除非设定一个宽度

<div>，<p>，<h1>，<form>，<ul> 和 <li> 是块元素的例子

display:inline 就是将元素显示为行内元素，元素的特点是：和其他元素都在一行上；高，行高及顶和底边距不可改变；宽度就是它的文字或图片的宽度，不可改变。<span>，<a>，<label>，<input>，<img>，<strong> 和 <em> 是 inline 元素的例子

2.鼠标手指状显示

全部用标准的写法 cursor: pointer;

前端兼容性问题八:背景、图片类

1. background显示问题

全部注意补齐 width，height 属性

2.背景透明问题

IE: filter: progid: DXImageTransform.Microsoft.Alpha(style=0,opacity=60);

IE: filter: alpha(opacity=10);

Firefox: opacity:0.6;

Firefox: -moz-opacity:0.10;

最好两个都写，并将opacity属性放在下面

前端兼容性问题九:min-height最小高度的实现（兼容IE6、IE7、Firefox）

作用是：当容器的内容较少时，能保持一个最小的高度，以免破坏了布局或UI设计效果。而当容器内的内容增加的时候，容器能够自动的伸展以适应内容的变化。

前端兼容性问题十：为什么web标准中无法设置IE浏览器滚动条颜色了？

原来样式设置：

解决办法是将body换成html。

需要更多前端学习资料/视频/学习方法，请关注，有许多关于前端javascript/HTML5的学习资料，游戏，视频，源码！

,