IE各版本CSS Hack(兼容性处理)语法速查表
为了兼容IE各个版本,需要在CSS中添加额外的代码,比如以前常用的_width。之所以工作,是因为浏览器会忽略不能解析的样式规则,因此举个例子来说,把_width写在width下面,对于非IE浏览器会解析到width,而对于IE6来说,会用_width覆盖前面的width规则,从而达到针对IE6浏览器的兼容。对于IE其他版本(6~11),也存在同样的兼容性处理方法。虽然本站不对IE做特别的兼容性测试,基本上只支持Chrome/FF/Edge/Safari,但有时候客户项目会有这方面需求,下面是一个速查表:
div {
property:value\0; /* ie 8/9*/
property:value\9\0; /* ie 9*/
*property:value; /* ie 7*/
_property:value; /* ie 6*/
}
IE 6
* html .ie6 {property:value;}
or
.ie6 { _property:value;}
IE 7
*+html .ie7 {property:value;}
or
*:first-child+html .ie7 {property:value;}
IE 6 and 7
@media screen\9 {
.ie67 {property:value;}}
or
.ie67 { *property:value;}
or
.ie67 { #property:value;}
IE 6, 7 and 8
@media \0screen\,screen\9 {
.ie678 {property:value;}}
IE 8
html>/**/body .ie8 {property:value;}
or
@media \0screen {
.ie8 {property:value;}}
IE 8 Standards Mode Only
.ie8 { property /*\**/: value\9 }
IE 8,9 and 10
@media screen\0 {
.ie8910 {property:value;}}
IE 9 only
@media screen and (min-width:0\0) and (min-resolution: .001dpcm) {
// IE9 CSS
.ie9{property:value;}}
IE 9 and above
@media screen and (min-width:0\0) and (min-resolution: +72dpi) {
// IE9+ CSS
.ie9up{property:value;}}
IE 9 and 10
@media screen and (min-width:0\0) {
.ie910{property:value\9;} /* backslash-9 removes ie11+ & old Safari 4 */}
IE 10 only
_:-ms-lang(x), .ie10 { property:value\9; }
IE 10 and above
_:-ms-lang(x), .ie10up { property:value; }
or
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
.ie10up{property:value;}}
IE 11 (and above..)
_:-ms-fullscreen, :root .ie11up { property:value; }
IE各版本CSS Hack(兼容性处理)语法速查表的更多相关文章
- Markdown 语法速查表
Markdown 语法速查表 1 标题与文字格式 标题 # 这是 H1 <一级标题> ## 这是 H2 <二级标题> ###### 这是 H6 <六级标题> 文 ...
- javascript语法速查表
- css hack 兼容性
做前端多年,虽然不是经常需要hack,但是我们经常会遇到各浏览器表现不一致的情况.基于此,某些情况我们会极不情愿的使用这个不太友好的方式来 达到大家要求的页面表现.我个人是不太推荐使用hack的,要知 ...
- Java, C#, Swift语法对比速查表
原文:Java, C#, Swift语法对比速查表 Java 8 C# 6 Swift 变量 类型 变量名; 类型 变量名; var 变量名 : 类型; 变量(类型推断) N/A var 变量名= ...
- Python语法速查: 4. 字符串常用操作
返回目录 (1)字符串常用方法 Python3中,字符串全都用Unicode形式,所以省去了很多以前各种转换与声明的麻烦.字符串属于序列,所有序列可用的方法(比如切片等)都可用于字符串. 注意:字符串 ...
- HTML、CSS、JS、JQ速查笔记
一.HTML 1.编写html文件 a.格式 <!DOCTYPE html> <html> <head> <title>标题</title& ...
- css选择器语法速查
通用选择器 *{} 类似于通配符,匹配文档中所有元素类型: 类型选择器 h1,h2,p{} 匹配以逗号隔开元素列表中的所有元素 类选择器 .glass{} or p.glass{} id选择器 #id ...
- perl 语法速查
同时学perl.python和shell脚本会很容易将它们的语法搞混,本文主要是一个个人的总结,方便要用时的查询. perl基本语法.安装.帮助文档 文件头格式: #!/usr/bin/perl us ...
- css字体中英速查表
例1(小米米官网):font-family: "Arial","Microsoft YaHei","黑体","宋体",s ...
随机推荐
- 欢乐水杯(happy glass)中流体的一种实现!图文视频讲解 ! Cocos Creator!
使用cocos creator v2.2.2 实现流体效果 ! 图文+视频讲解! 效果预览 实现原理 整体思路是参考论坛中的一个帖子 这款游戏中水的粘连效果在Construct3中利用图层很容易实现, ...
- 微信开发+百度AI学习:微信网页开发环境搭建
参考微信官方文档:https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115 两步即可获取微信网页开发能力 STEP1: ...
- [离散化+树状数组]CodeForces - 652D Nested Segments
Nested Segments time limit per test 2 seconds memory limit per test 256 megabytes input standard inp ...
- [STL] Codeforces 69E Subsegments
Subsegments time limit per test 1 second memory limit per test 256 megabytes input standard input ou ...
- 比CNN表现更好,CV领域全新卷积操作OctConv厉害在哪里?
CNN卷积神经网络问世以来,在计算机视觉领域备受青睐,与传统的神经网络相比,其参数共享性和平移不变性,使得对于图像的处理十分友好,然而,近日由Facebook AI.新家坡国立大学.360人工智能研究 ...
- FME中按照ID值过滤块参照中的多个要素
- 用pymysql和Flask搭建后端,响应前端POST和GET请求
前言 这次作业不仅需要我建立一个数据库(详情请点击这里),还需要我基于这个数据库写后端接口(注册和登录)供前端访问,接收前端的POST和GET请求,并将登录.注册是否成功传给前端. 本文介绍如何用Fl ...
- [vijos]1051送给圣诞夜的极光<BFS>
送给圣诞夜的极光 题目链接:https://www.vijos.org/p/1051 这是一道很水很水的宽搜水题,我主要是觉得自己在搜素这一块有点生疏于是随便找了一题练手,找到这么一道水题,原本以为可 ...
- 面向对象编程基础(java)
面向对象编程基础 1.1 面向对象概述 在程序开发初期,大家使用的是结构化开发语言,也就是面向过程(opp),但随着市场需求剧增,软件的规模也越来越大,结构化语言的弊端也暴露出来. 开发周期无休止的拖 ...
- 实验十一 MySQLl备份与恢复1
实验十一 MySQL备份与恢复 一. 实验内容: 1. 使用SQL语句导入和导出表数据 2. 使用客户端工具备份还原数据库 3. 使用日志文件恢复数据库 二. 实验项目:学生成绩数据库 创建用于学 ...