主要讲下hack的兼容用法,比较浅,哈哈
hack是主要来处理IE的兼容,不同的IE,不同的兼容方式
| /* | |
| 属性前缀法(即类内部Hack): | |
| *color:#000; *号对IE6,IE7都生效 | |
| +color:#555; +号对IE6--IE10都生效 | |
| -color:#999; -号只对IE6生效 | |
| _color:#888; _下划线只对IE6生效 | |
| color:red\9;\9对 IE6/IE7/IE8/IE9/IE10都生效 | |
| color:blue\0; \0对IE8/IE9/IE10都生效,是IE8/9/10的hack | |
| color:green\9\0; \9\0 只对IE9/IE10生效,是IE9/10的hack | |
| #color:pink; #号对IE6/IE7/IE8/IE9/IE10都生效 | |
| */ |
看看怎么用的,来吧
| width: 300px\9; | |
| *width: 800px; | |
| _width: 300px; | |
| height: 120px; | |
| height: 60px\9; | |
| *height: 80px; | |
| _height: 100px; | |
| color: #FF6900; | |
| color: red\9; | |
| *color: deepskyblue; | |
| _color: #000; | |
| /*color:blue;*/ | |
| background: #aaa; | |
| background: #ddd\9; | |
| *background: red; | |
| _background: #aaa; | |
| box-shadow: 0 0 5px #555; | |
| box-shadow: 0 0 5px #555\9; | |
| *box-shadow: 0 0 5px #555; | |
| _box-shadow: 0 0 5px #555; | |
| /*border: 1px solid #FF6900;*/ | |
| /*border: 4px solid red\9;*/ | |
| /**border: 8px solid deepskyblue;*/ | |
| /*_border: 12px solid #000;*/ | |
| text-align: center; | |
| line-height: 100px; |
他也支持选择器的hack:
| CSS选择器的Hack | |
| *html: 在选择器前面加 *html 表示该样式在IE6以及IE6以下版本浏览器生效 | |
| :root: 在选择器前面加 :root 表示该样式在IE9及以上版本浏览器生效,对firefox和chrome也生效 | |
| *+html: 在选择器前面加 *+html 表示该样式仅仅在IE7版本浏览器生效 | |
| html>body: 在选择器前面加 html>body 表示该样式除IE6之外的所有浏览器都生效 |
例子:
| */ | |
| *html .a { | |
| color:#fff; | |
| } | |
| :root .a { | |
| /*color: blue;*/ | |
| } | |
| *+html .a{ | |
| /*color:#ff6900;*/ | |
| } | |
| html>body .a { | |
| color: green; | |
| } |
Hack还支持html文本格式的兼容,意思是他可以找到你所匹配的IE版本,然而他并不是注释,第一次用它的话,哈哈哈,有可能你会觉得他是个注释,
同时也支持大于某一个版本,或者小于It某一个ie版本
| <!--IE条件注释法(即HTML条件注释Hack)--> | |
| <!--[if IE]> | |
| <p>所有IE浏览器显示</p> | |
| <![endif]--> | |
| <!--[if IE 7]> | |
| <p>IE7浏览器显示,数字可以改 ,比如改成8,就是IE8浏览器显示</p> | |
| <![endif]--> | |
| <!--[if gte IE 6]> | |
| <p>IE6以上(包括)浏览器显示,数字可以改 ,比如改成7,就是IE7以上(包括)浏览器显示</p> | |
| <![endif]--> | |
| <!--[if ! IE 8]> | |
| <p>非IE8浏览器显示,数字可以改 ,比如改成9,就是非IE9浏览器显示</p> | |
| <![endif]--> | |
| <!--[if !IE]> | |
| <p>非IE浏览器显示</p> | |
| <![endif]--> |
同理,在head里面,我们也可以写IE的兼容,例子来了
主要讲下hack的兼容用法,比较浅,哈哈的更多相关文章
- CentOS7下Firewall防火墙配置用法详解
官方文档地址: https://access.redhat.com/documentation/en-US/Red_Hat_Enterprise_Linux/7/html/Security_Guide ...
- linux下find查找命令用法
Linux下find命令在目录结构中搜索文件,并执行指定的操作.Linux下find命令提供了相当多的查找条件,功能很强大.由于find具有强大的功能,所以它的选项也很多,其中大部分选项都值得我们花时 ...
- IE6/IE7下margin-bottom失效兼容解决办法及双倍边距问题
(从已经死了一次又一次终于挂掉的百度空间人工抢救出来的,发表日期 2014-04-08) 一.IE6/IE7下margin-bottom失效兼容解决办法 1.用padding-bottom代替:2.在 ...
- Asp.net服务器控件在IE10下的不兼容问题
Asp.net服务器控件在IE10下的不兼容问题 时间:2013-05-16 09:07点击: 89 次 [大 中 小] 相信很多使用IE10的童鞋们已经发现了这个问题,以下是本人在IE10标准模式下 ...
- IE6-7下margin-bottom不兼容解决方法(非原创,视频中看到的)
在IE低版本下有很多不兼容,现在将看到的 IE6-7下margin-bottom不兼容解决方法 演示一下,方便日后自己查阅. <!DOCTYPE html> <html la ...
- FCKEditor在IE10下的不兼容问题解决方法
环境介绍:FCKEditor 版本 2.x.x 问题:IE10 下FCKEditor不兼容,显示不出来 关键词:不同于其他方法之处是第一个关键点,其他网友的正则表达式不对 解放方法:(可以直接< ...
- Scala中_(下划线)的常见用法
Scala中_(下划线)的常见用法 地址:https://www.jianshu.com/p/0497583ec538
- windows和linux下目录分隔符兼容问题(换行回车兼容)
windows和linux下目录分隔符兼容 DIRECTORY_SEPARATOR 换行回车兼容 PHP_EOF
- Bootstrap历练实例:导航内下拉菜单的用法
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...
随机推荐
- Python数据类型方法精心整理,不必死记硬背,看看源码一切都有了
Python认为一切皆为对象:比如我们初始化一个list时: li = list('abc') 实际上是实例化了内置模块builtins(python2中为__builtin__模块)中的list类: ...
- Ansible系列(一):基本配置和使用
本文目录:1.1 安装Ansible1.2 配置Ansible 1.2.1 环境配置 1.2.2 SSH互信配置 1.2.3 简单测试1.3 inventory Ansible是一种批量.自动部署工具 ...
- Hibernate第十篇【Hibernate查询详解、分页查询】
前言 在Hibernate的第二篇中只是简单地说了Hibernate的几种查询方式-.到目前为止,我们都是使用一些简单的主键查询阿-使用HQL查询所有的数据-.本博文主要讲解Hibernate的查询操 ...
- 02_Ext_Panel
1,面板由以下几个部分组成, 一个顶部工具栏(tbar).一个底部工具栏(bbar).面板头部(header).面板尾部(bottom).面板主区域(body)几个部分组成. 面板类中还内置了面板展开 ...
- Spring @RequestParam乱码问题
在网上找了很多资料才找到解决的方法,通过URL传递命名参数,后台接收的却是乱码解决方法如下: 方法一:将接收的参数重新编码 @RequestMapping(value="/handle&qu ...
- maven使用私服以后,Missing artifact xxx:xxx:jar:xx的问题
这里提供的是一种针对特殊情况的的解决方案. 即在你可以顺利使用本地仓库时,在settings.xml中加上私服配置以后出现这样的问题. 解决方案: windows→preferences→Maven→ ...
- 字符、字符集、编码,以及它们python中会遇到的一些问题(下)
在看了很多的博客文章之后,总结整理得到了以下文章,非常感谢这些无私奉献的博主! 文章末尾有本文引用的文章的链接,如果有漏掉的文章引用,可以发邮件联系我,随后再次附上链接! 侵删!!! 这一部分是下篇, ...
- Java 使用Axis实现WebService实例
在上一篇WebService实例中,基于jdk1.6以上的javax.jws 发布webservice接口.这篇博文则主要用eclipse/myeclipse 使用axis插件进行发布和调用WebSe ...
- CentOS 搭建Graylog集群详解
1. Graylog2 简介 Graylog 是一个简单易用.功能较全面的日志管理工具,相比 ELK 组合, 优点: 部署维护简单,一体化解决方案,不像ELK三个独立系统集成. 查相比ES json语 ...
- I/P/B/SI/SP帧和PTS/DTS的关系
I frame:帧内编码帧 又称intra picture,I 帧通常是每个 GOP(MPEG 所使用的一种视频压缩技术)的第一个帧,经过适度地压缩,做为随机访问的参考点,可以当成图象.I帧可以看成是 ...