网站浏览器不兼容解决方法
2018-11-01 来源：学做网站论坛
做网站的人最大的苦恼是自己做的网站在不同的浏览器呈现的界面不一样，在火狐浏览器打开非常正常，但在IE浏览器打开却出现错位。如下图：
这主要是由于我们自己建网站时没有使用网站浏览器兼容测试软件–IETester进行兼容性测试，导致不同浏览器对于HTML代码的处理能力不一样造成了。
为了让每一个用户使用不同浏览器能正常打我们自己做的网站，防止网站的浏览器不兼容，就需要我们将每个浏览器之间规范一下，我们可以通过网站的CSS样式添加一段规范化代码，这样就可以让我们的网站在各个浏览器下正常显示了，彻底解决网站的浏览器不兼容问题。
防止网站浏览器不兼容的CSS代码（将下面的代码放在CSS文件的顶部）：
/* 重置浏览器样式 */
html{color:#666;background:#F4F4F4;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,p,pre,code,form,fieldset,legend,input,button,textarea,blockquote{margin:0;padding:0;}
body,button,input,select,textarea{font-family:'Helvetica Neue',Helvetica,Arial,Sans-serif;font-size: 14px;line-height:1.7;word-wrap: break-word;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
em,i{font-style:normal;font-weight:normal;}
ul,ol{list-style:none;}
table{border-collapse:collapse;border:0;padding:0;margin:0;}
img{border: 0;vertical-align: middle;}
a img{border-width:0;vertical-align:middle;}
a{cursor:pointer}a:link{color:#666;text-decoration:none;}a:visited{color:#666;text-decoration:none;}a:hover{color:#568ABE;text-decoration:underline;}a:active{color:#568ABE;text-decoration:none;}
.cGray{color:#333;}.cCcc{color:#ccc;}.f14px{font-size:14px;}.cRed{color: #c33;}
.mb5{margin-bottom: 5px;}.mb10{margin-bottom: 10px;}.mb15{margin-bottom: 15px;}.mb20{margin-bottom: 20px;}
.mt5{margin-top: 5px;}.mt10{margin-top: 10px;}.mt15{margin-bottom: 15px;}.mt20{margin-top: 20px;}.mt30{margin-top: 30px;}
.mr5{margin-right: 5px;}.mr10{margin-right: 10px;}.mr15{margin-right: 15px;}.mr20{margin-right: 20px;}
.mlr5{margin:0 5px;}
pre {background-color: #F1EDED; padding: 5px; border: 1px solid #FF9;}
/* 浮动与清除 */
.fleft{float:left;}.fright{float:right;}.clearfix:after{clear:both;content:".";display:block;height:0;font-size:0;visibility:hidden;}.clearfix{*zoom:1;}
html{color:#666;background:#F4F4F4;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,p,pre,code,form,fieldset,legend,input,button,textarea,blockquote{margin:0;padding:0;}
body,button,input,select,textarea{font-family:'Helvetica Neue',Helvetica,Arial,Sans-serif;font-size: 14px;line-height:1.7;word-wrap: break-word;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
em,i{font-style:normal;font-weight:normal;}
ul,ol{list-style:none;}
table{border-collapse:collapse;border:0;padding:0;margin:0;}
img{border: 0;vertical-align: middle;}
a img{border-width:0;vertical-align:middle;}
a{cursor:pointer}a:link{color:#666;text-decoration:none;}a:visited{color:#666;text-decoration:none;}a:hover{color:#568ABE;text-decoration:underline;}a:active{color:#568ABE;text-decoration:none;}
.cGray{color:#333;}.cCcc{color:#ccc;}.f14px{font-size:14px;}.cRed{color: #c33;}
.mb5{margin-bottom: 5px;}.mb10{margin-bottom: 10px;}.mb15{margin-bottom: 15px;}.mb20{margin-bottom: 20px;}
.mt5{margin-top: 5px;}.mt10{margin-top: 10px;}.mt15{margin-bottom: 15px;}.mt20{margin-top: 20px;}.mt30{margin-top: 30px;}
.mr5{margin-right: 5px;}.mr10{margin-right: 10px;}.mr15{margin-right: 15px;}.mr20{margin-right: 20px;}
.mlr5{margin:0 5px;}
pre {background-color: #F1EDED; padding: 5px; border: 1px solid #FF9;}
/* 浮动与清除 */
.fleft{float:left;}.fright{float:right;}.clearfix:after{clear:both;content:".";display:block;height:0;font-size:0;visibility:hidden;}.clearfix{*zoom:1;}
将以上代码复制粘贴到自己网站的CSS样式的最上面即可。另外我们在写HTML代码时，也可规范，可以先学习一下学做网站论坛的html视频教程。
相关知识：网站出现IE浏览器不兼容的解决方法汇总
版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点！
本站所提供的图片等素材，版权归原作者所有，如需使用，请与原作者联系。
最新资讯
热门推荐