CSS Hack及常用的技巧
不同的浏览器，比如Internet Explorer 6、Internet Explorer 7、 Mozilla Firefox对CSS的解析认识不一样，因此会导致生成的页面效果不一样，得不到我们所需要的页面效果。此时我们需要针对不同的浏览器写不同的CSS，让它能够兼容不同的浏览器，能够在不同的浏览器中得到我们想要的页面效果。针对不同浏览器编写不同CSS code的过程就叫CSS Hack，或叫写CSS Hack。
不同浏览器对CSS解析的差别如下：
- !important能被IE7、FF识别，但不能被IE6识别
- IE6支持"*" or "_"开头的CSS，IE7支持"*"开头的CSS，但不支持"_"开头的CSS，FF两者都不支持
- "+"开头的CSS样式仅能被IE7识别
- "\0"结束的CSS样式仅能被IE8识别
- "\9"的CSS样式能被IE识别
【书写顺序：针对FF的样式放在最前面，针对IE7的样式放在中间，针对IE6的样式放在最后 】
1. !important
!important 指定样式应用规则的优先权，区别IE6与IE7，区别IE6与其它浏览器。
.browserTest
{
border:20px solid #60A179 !important;
border:20px solid #00F;
}
IE7和其它标准浏览器能识别!important，显示#60A179颜色，IE6不能识别!important，显示#00F颜色。
2. *
IE都能识别"*"，标准浏览器（如FF）不能识别"*"。
区别IE与FF：
.browserTest { border:20px solid #60A179; *border:20px solid #00F;}
区别IE6、IE7、FF：
.browserTest
{
border:20px solid #60A179;
border:20px solid #00F !important;
*border:20px solid #fff;
}
3. _
IE6支持"_"，IE7和FF都不支持"_" 。区别IE6、IE7、FF：
.bowserTest { border:20px solid #60A179; *border:20px solid #00F; _border:20px solid #fff;}
4. *+html 与 *html
*+html 与 *html 是IE特有的标签， firefox 暂不支持。而*+html 又为 IE7特有标签
.browserTest { width: 120px; } /* FireFox fixed */
*html .browserTest { width: 80px;} /* ie6 fixed */
*+html .browserTest { width: 60px;} /* ie7 fixed */
*+html 对IE7的HACK 必须保证HTML顶部有如下声明：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
CSS Hack及常用的技巧的更多相关文章
- CSS書寫規範及CSS Hack
基本原则: CSS样式可细分为3类:自定义样式.重新定义HTML样式.链接状态样式. 样式为设计师自定义的新 CSS 样式,影响被使用本样式的区域,用于完成网页中局部的样式设定. 样式名 “.”+“相 ...
- CSS选择器、CSS hack及CSS执行效率
主要内容: 1.CSS选择器.优先级与匹配原理 2. CSS 引入的方式有哪些 ? link 和 @import 的区别是 ? 3.CSS hack 4.如何书高效CSS 一.CSS选择器.优先级与 ...
- CSS Hack技术介绍及常用的Hack技巧集锦
一.什么是CSS Hack? 不同的浏览器对CSS的解析结果是不同的,因此会导致相同的CSS输出的页面效果不同,这就需要CSS Hack来解决浏览器局部的兼容性问题.而这个针对不同的浏览器写不同的CS ...
- CSS Hack技术介绍及常用的Hack技巧
一.什么是CSS Hack? 不同的浏览器对CSS的解析结果是不同的,因此会导致相同的CSS输出的页面效果不同,这就需要CSS Hack来解决浏览器局部的兼容性问题.而这个针对不同的浏览器写不同的CS ...
- CSS hack常用方案（摘选）
邮箱因为默认了line-height?:170%,导致采用table元素时继承问题,可以采用line-height:50% 很好解决. 常 在使用float时,后面的显示不正常,因为继承了float了 ...
- 常用的CSS Hack
一.什么是CSS Hack? 不同的浏览器对CSS的解析结果是不同的,因此会导致相同的CSS输出的页面效果不同,这就需要CSS Hack来解决浏览器局部的兼容性问题.而这个针对不同的浏览器写不同的CS ...
- 常用的CSS Hack技术集锦
来源:http://www.ido321.com/938.html 一.什么是CSS Hack? 不同的浏览器对CSS的解析结果是不同的,因此会导致相同的CSS输出的页面效果不同,这就需要CSS Ha ...
- CSS hack技巧
CSS hack技巧一览,原文来自CSDN freshlover的博客专栏<史上最全CSS Hack方式一览> 什么是CSS hack 由于不同厂商的流览器或某浏览器的不同版本(如IE6- ...
- 常用CSS HACK
常用CSS HACK IE6 3像素bug和双边距bug一样的经典 现象: IE6下浮动元素和不浮动元素之间会有3px间隙(3px bug,div.float-left + div.float-non ...
随机推荐
- ajax获取城市和相应的地区
<!DOCTYPE html><html lang="zh-CN"><head> <meta charset="UTF-8&qu ...
- ios中javascript直接调用oc代码而非通过改变url回调方式(转)
之前一个ios项目中,需要通过UIWebview来打开一个静态页面,并在静态页面中 调用相关object-c代码. 一.以前使用js调用object-c的方法 关于如何使用javascript调用ob ...
- Ubuntu 查看文件以及磁盘空间大小管理
(1)查看文件大小 查看当前文件夹下所有文件大小(包括子文件夹) du -sh # du -h15M ./package16K ./.fontconfig4.0K . ...
- 转！！ Java中如何遍历Map对象的4种方法
在Java中如何遍历Map对象 How to Iterate Over a Map in Java 在java中遍历Map有不少的方法.我们看一下最常用的方法及其优缺点. 既然java中的所有map都 ...
- 转！！Java垃圾回收机制
1. 垃圾回收的意义 在C++中,对象所占的内存在程序结束运行之前一直被占用,在明确释放之前不能分配给其它对象:而在Java中,当没有对象引用指向原先分配给某个对象的内存时,该内存便成为垃圾.JVM的 ...
- JavaScript 同名方法的处理
在JS中,如果存在同名同参的方法,它会先调用哪一个?先看两个例子: 例1: <html> <head> <title></title> <scri ...
- C++ Primer 笔记（2）第二章 变量与基本类型
第二章 变量与基本类型 1.基本内置类型包括算术类型和空类型,算术类型分为两类:整型(包括字符和布尔类型)和浮点型: 2.布尔类型(bool)的取值是真(true)或者假(false): 3.字面值常 ...
- 【转】 C++中delete和delete[]的区别
一直对C++中的delete和delete[]的区别不甚了解,今天遇到了,上网查了一下,得出了结论.做个备份,以免丢失. C++告诉我们在回收用 new 分配的单个对象的内存空间的时候用 delete ...
- centos7配置mono和jexus5.6.2
一.通过集成包安装mono: 1.添加Mono的 包库源: 把Mono Project public Jenkins GPG signing 导入系统 wget http://jenkins.mon ...
- Reverse Integer [LeetCode]
Reverse digits of an integer. Example1: x = 123, return 321Example2: x = -123, return -321 click to ...