易捷网络专注企业网站建设
11年企业网站建设经验、响应式网站建设,兼容PC、手机、平板全
终端,给你更佳的浏览体验...

网页存在兼容性问题怎么处理

来源:网站建设行业资讯网
添加时间:2022-01-17
网站设计制作中由于不同的浏览器对CSS样式的解析方法不一样,从而造成了网页兼容问题。针对不同浏览器写不同CSS样式,这个过程称为csshack。大家都知道在目前ie浏览器的市场份额是较高的,其次就是火狐和chrome浏览器,可以说解决网页兼容问题就是针对这三款浏览器。

网站设计制作中由于不同的浏览器对CSS样式的解析方法不一样,从而造成了网页兼容问题。针对不同浏览器写不同CSS样式,这个过程称为csshack。大家都知道在目前ie浏览器的市场份额是较高的,其次就是火狐和chrome浏览器,可以说解决网页兼容问题就是针对这三款浏览器。

为什么浏览器对css的解析不同?那么我将以那个浏览器较为标准呢?这是因为浏览器软件开发中存在的技术缺陷。一般来说火狐浏览器和chrome对css的解析是正确的,而ie则存在一些bug,我们总不能以一个错误的标准去修正我们的行为。所以我们*先用火狐或者googlechrome浏览器来将网页的css样式设置好,然后对ie的各版本设置css兼容。

ie的各个版本中,0于ie6的版本几乎没有什么人在用,可以将其忽略,那么我们设置css浏览器兼容的对象就集中在ie6~ie9。我们可以通过以下方式来分别对不同浏览器设置css:
在</head>标记之前插入只对ie浏览器适用的条件注释代码。

1<!--[ifltIE7]>版本小于IE7将看到这行<![endif]-->

2<!--[iflteIE7]>版本小于或等于IE7将看到这行<![endif]-->

3<!--[ifIE7]>版本如果是IE7将看到这行<![endif]-->

4<!--[ifgtIE7]>版本大于IE7将看到这行<![endif]-->

lt(小于)、gt(大于)、lte(小于或等于)、gte(大于或等于)

实例代码:

1<!--[ifIE6]>

2<styletype="text/css">

3/*针对IE6定义的样式*/

4</style>

5<![endif]-->

2、csshack

针对特定版本的ie写css样式,以下是各版本ie的csshack写法列表:

HackExampleIE6(S)IE6(Q)IE7(S)IE7(Q)IE8(S)IE8(Q)

**colorYesYesYesYesNoYes

++colorYesYesYesYesNoYes

--colorYesYesNoNoNoNo

__colorYesYesNoYesNoYes

##colorYesYesYesYesNoYes

\0color\0NoNoNoNoYesNo

\9color\9YesYesYesYesYesYes

!importantcolor:blue!important;color:green;NoNoYesNoYesNo

这里S代表standard标准模式,Q代表Quirks怪异模式

实例代码:
.box{
background:gray;/*基本的*/
background:pink\9;/*IE8及0于IE8版本*/
*background:green;/*IE7及0于IE7版本*/
-background:blue;/*IE6*/
}
3、针对googlechrome浏览器的csshack:
@mediascreenand(-webkit-min-device-pixel-ratio:0){
/*针对GoogleChrome、Safari3.0、Opera9的CSS样式*/
}
4、针对firefox浏览器的csshack:
@-moz-documenturl-prefix(){
/*针对firefox的CSS样式*/
}

网站建设计最新案例赏析:


乐清乐鸟电气网站制作首页设计效果图
乐清乐鸟电气
河南赛唯家具网站制作首页设计效果图
河南赛唯家具
深圳华璨文化传播网站制作首页设计效果图
深圳华璨文化传播
上海三羽电器网站制作首页设计效果图
上海三羽电器
广州波士特实验室设备网站制作首页设计效果图
广州波士特实验室设备
湖南新展博会展服务网站制作首页设计效果图
湖南新展博会展服务
东莞五源企业形象设计网站制作首页设计效果图
东莞五源企业形象设计
千瑞文化信息有限公司网站制作首页设计效果图
千瑞文化信息有限公司
东莞索诚电子网站制作首页设计效果图
东莞索诚电子
深圳市航冠实业网站制作首页设计效果图
深圳市航冠实业
 

网站建设行业资讯推荐阅读:


分析自媒体和网站建设之间的关系深圳网站设计|营销网站设计为什么受欢迎怎样搞好新上线平台网站的优化关键点做网站设计要注意哪些不能犯的问题做网站建设推广能给企业带来哪些好处呢网站建设开发上线之前需要测试那些内容运行tomcat8w.exe提示未安装指定的服务,tomcat8w.exe不能启动服务网站建设方案常有什么內容多元化才是引流l量的关键,网站引流不能全靠SEO如何确保网站制作的安全性深圳网站建设前期如何推广呢深圳网站建设教你如何玩转流量站销售客服专员中小型企业网站建设的必要性网站关键词上到首页下一步该怎么做企业网站建设在网络推广中有哪些优势网站设计新趋势企业如何打造属于自己的商城网站用以提高客户的回头率!中小企业为什么要做网站建设,有哪些需要注意的地方怎么做好汽车服务网站建设网站建设公司哪家好选择时要注重哪些方面企业网站如何满足企业需求深圳网站制作必经的几个过程网站开发的费用包含哪些方面企业网站建设和运营中的四大要点网站设计怎么才更吸引用户为什么企业拒绝使用模板网站大势所趋!移动端网站设计趋势做网站建设的步骤详细介绍!网络推广如何运营自己的网站深圳网站建设选择态度诚恳具有实力公司易捷网络浅谈企业做营销型网站建设的好处企业网站建设时应注意的几点事项把握这种小技巧小白也可以当网页室内设计师 网站设计中有哪些视觉营销法则门户网站建设公司告诉你搭建重点是什么有哪些优点门户网站建设有哪些关键点新手来收!设计师必备设计黄金法则3个适用性极强的网页设计趋势服务器租用和服务器托管有什么区别,哪个更合算如何做到“一站式”管理多种语言版本的网站后台外包公司软件定制该何去何从处处实名制,域名解析也一样为什么企业和个人要建立自己的网站运营网站如何蹭热点301重定向一级域名定向到www二级域名营销网站建设的意义是什么今年网站建设价格一般多少钱教你真真认识网络营销的三大定律网页设计流程中常见问题分析及建议(一)什么是营销网站营销网站对企业发展有哪些帮助如何选择优质网站开发服务商1低个免费在线工具测试网站速度易捷网络看网站建设和企业发展战略的关系-商务服务聊聊响应式设计的现状以及未来趋势如何设计企业官网更专业网站建设:企业网站优化才是关键 服务好的设计网页定做自适应网站建设方案是什么网建服务商高效网站建设基本服务流程!
企业网站建设行业信息服务发布平台!
(www.fantodo.com)版权所有
QQ在线咨询