尽管微软Edge已逐渐取代IE成为主流，但从网站统计数据来看，仍有相当一部分用户（尤其是传统行业或政企单位）在使用IE6、IE7、IE8或Firefox老版本。因此，在安丘企业进行网站制作时，浏览器兼容性（Browser Compatibility）依然是不可忽视的技术环节。今天，寿光炎黄网设计为您汇总当前最有效的CSS Hack与兼容解决方案。
以下方法是解决IE6/IE7与现代浏览器差异的核心手段，通过CSS优先级和浏览器私有特性进行区分。
在编写CSS时，可通过以下前缀针对性地对不同浏览器生效：
所有浏览器通用：height: 100px;
仅IE6专用：_height: 100px;或 *height: 100px;
仅IE7专用：*+height: 100px;
IE7与FF共用：height: 100px !important;（利用IE6不支持!important的特性）
随着IE7对!important的支持，现在的写法需更加严谨。建议将通用样式写在前面，利用层叠特性覆盖。
/* 通用写法 */#wrapper { width: 100px!important; /* Firefox/IE7+ 优先识别 */
width: 80px; /* IE6 识别 */}利用IE对HTML注释的解析漏洞进行Hack。
#wrapper { width: 120px; /* 现代浏览器 */}
*html #wrapper { /* 仅IE6 */
width: 80px;
}
*+html #wrapper { /* 仅IE7 */
width: 60px;
}注意：使用*+html针对IE7进行Hack时，HTML头部必须声明严格的DTD（如HTML 4.01 Transitional），否则无效。
当使用float布局导致父容器高度塌陷（Div错位、背景丢失）时，这是最通用的修复方案。将以下代码加入全局CSS，给需要闭合的div添加class="clearfix"即可。
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden;
}.clearfix { display: inline-block;
}/* Hides from IE-mac \*/* html .clearfix {height: 1%;}.clearfix {display: block;}/* End hide from IE-mac */盒模型差异（Box Model）
现象：FF下设置padding会导致width/height增加，IE不会。
解决：使用!important强制优先级，或采用标准的box-sizing: border-box;。
居中问题
水平居中：margin: 0 auto;
垂直居中：将line-height设置为与div高度相同，并结合vertical-align: middle;。
IE双倍Margin Bug
现象：浮动元素（float）在IE下横向margin会加倍。
解决：在浮动元素CSS中加入display: inline;，IE会忽略该声明但仍保留浮动效果。
IE最小宽度（Min-Width）Bug
现象：IE不识别min-width，会将width当作最小宽度。
解决：
#box { width: 80px; }html>body #box { width: auto; min-width: 80px; }手形光标
规范写法：cursor: pointer;（兼容所有浏览器）。
淘汰写法：cursor: hand;（仅IE支持，不推荐）。
如果您在安丘、潍坊及周边地区需要专业的网站建设、老旧网站兼容性改造或定制化开发服务，欢迎随时咨询。
寿光炎黄网设计 —— 您身边的互联网建站专家。
服务热线：400-053-6345
移动电话：13573619439 / 17685910981 / 13356781096 / 15269657889
官方网站地址：
网站建设官网：
400电话办理官网：|
服务范围：寿光 | 潍坊 | 安丘 | 山东全省及周边城市
