ie6 7 8 9 firefox的css兼容问题
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>无标题页</title>
<!--CSS兼容IE6 IE7 IE8 IE9 Firefox的总结-->
<style type="text/css">
#div
{
/* 一:*各种浏览器css hack兼容情况*/
width:200px;
height:200px;
background: red; /* 所有浏览器*/
/* background: black!important; /* 有ie7,ie8,ie9,,firefox,chrome支持 */
/* _background: yellow; /* 只有ie6支持 */
/* +background:yellow; /* 只有ie6,ie7支持 */
/* *+background:yellow; /* 只有ie6,ie7支持 */
/* *background:black; /* 只有ie6,ie7支持 */
/* background:yellow\9; /* 有ie6,ie7,ie8,ie9支持 */
/* background:black\0; /* 有ie8,ie9支持 */
}
/* body:nth-of-type(1) div /* 有ie9,firefox,chrome,Safari支持 */
/*{
width: 200px;
height: 200px;
background: red;
}*/ /* 二:其他说明
1、如果你的页面对IE7兼容没有问题,又不想大量修改现有代码,同时又能在IE8中正常使用,微软声称,
开发商仅需要在目前兼容IE7的网站上添加一行代码即可解决问题,此代码如下:
<meta http-equiv="x-ua-compatible" content="ie=7" />
2、body:nth-of-type(1) 如果这样写,表示全局查找body,将会对应第一个<body>。
3、还有其他写法,比如:
*html #test{}或者 *+html #test{}
4、*+html 对IE7的hack 必须保证HTML顶部有如下声明:
http://www.w3.org/TR/html4/loose.dtd
5、顺序:Firefox、IE8、IE7、IE6依次排列。
小知识:什么是CSS hack?
由于不同的浏览器,比如IE6、IE7、IE8、Firefox等,对CSS的解析认识不一样,因此会导致生成的页面效果不一样,得不到我们所需要的页面效果。
这个时候我们就需要针对不同的浏览器去写不同的CSS,让它能够同时兼容不同的浏览器,能在不同的浏览器中也能得到我们想要的页面效果。
这个针对不同的浏览器写不同的CSS code的过程,就叫CSS hack,也叫写CSS hack。*/ </style>
</head>
<body>
<div id="div1">
</div>
</body>
</html>
ie6 7 8 9 firefox的css兼容问题的更多相关文章
- DIV+CSS解决IE6,IE7,IE8,FF兼容问题
1.IE8下兼容问题,这个最好处理,转化成IE7兼容就可以.在头部加如下一段代码,然后只要在IE7下兼容了,IE8下面也就兼容了:1. <metahttp-equivmetahttp-equiv ...
- DIV+CSS解决IE6,IE7,IE8,FF兼容问题(转至http://www.douban.com/note/163291324/)
2011-07-25 21:11:47 DIV+CSS解决IE6,IE7,IE8,FF兼容问题 1.IE8下兼容问题,这个最好处理,转化成IE7兼容就可以.在头部加如下一段代码,然后只要在IE ...
- 浏览器 CSS 兼容写法的测试总结
做前端最讨厌的就是 IE6,7,8,虽然被淘汰的浏览器,但是在中国用户仍然很多,不可能像国外网站一样直接就不管它了,这样会流失很多流量啊. 现在有了IE9,IE10还好些,几乎和 Chrome,Fir ...
- css padding在ie7、ie6、firefox中的兼容问题
padding 简写属性在一个声明中设置所有内边距属性. 说明这个简写属性设置元素所有内边距的宽度,或者设置各边上内边距的宽度.行内非替换元素上设置的内边距不会影响行高计算:因此,如果一个元素既有内边 ...
- 兼容IE6/IE7/IE8/FireFox的css hack
兼容IE6/IE7/IE8/FireFox的css hack .color{ background-color: #CC00FF; background-color: #FF00009; *backg ...
- CSS兼容IE6 IE7 IE8 IE9 Firefox的总结
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- IE和firefox火狐在JS、css兼容区别
1.firefox不能对innerText支持. firefox支持innerHTML但却不支持innerText,它支持textContent来实现innerText,不过默认把多余的空格也保留了. ...
- 转 CSS hack:针对IE6,IE7,firefox显示不同效果
CSS hack:针对IE6,IE7,firefox显示不同效果 做网站时经常会用到,衡量一个DIV+CSS架构师的水平时,这个也很重要. 区别不同浏览器的CSS hack写法: 区别IE6与FF: ...
- CSS兼容IE Firefox问题与解决方法
一.双边距问题浮动元素的外边距会加倍,但与第一个浮动元素相邻的其他浮动元素外边距不会加倍.解决方法:在此浮动元素增加样式 display:inline; 二.图片产生的间隙父元素直接包含<im ...
随机推荐
- 简易版CSS3 Tab菜单 实用的Tab切换
今天我们要来分享一款非常简易而又实用的CSS3 Tab菜单,Tab菜单没有非常华丽的动画,但是代码非常简洁易懂,也可以在大部分场合使用,因此也非常实用,如果你需要加入动画效果,也可以自己方便地修改这款 ...
- 《Genesis-3D开源游戏引擎-官方录制系列视频教程:进阶实例篇》
注:本系列教程仅针对引擎编辑器:v1.2.2及以下版本 G3D进阶实例 第四课<2D编辑与脚本的统一入口> 使用G3D完成一个简单的类飞机大战游戏,介绍了G3D2d游戏制作的流程包括: ...
- Struts2的运行流程以及关键拦截器介绍
Struts2的运行流程 1.ActionProxy是Action的一个代理类,也就是说Action的调用是通过ActionProxy实现的,其实就是调用了ActionProxy.execute()方 ...
- AngularJS 学习笔记二
AngularJS指令 指令 描述 讲解 ng_app 定义应用程序的根元素. 指令 ng_bind 绑定 HTML 元素到应用程序数据. 简介 ng_click 定义元素被单击时的行为. HTML ...
- Educational Codeforces Round 3 E. Minimum spanning tree for each edge (最小生成树+树链剖分)
题目链接:http://codeforces.com/contest/609/problem/E 给你n个点,m条边. 问枚举每条边,问你加这条边的前提下组成生成树的权值最小的树的权值和是多少. 先求 ...
- Excel Xll开发资料
下载地址:http://bbs.jjxj.org/forum.php?mod=viewthread&tid=37943&extra=page%3D1&page=1& 财 ...
- Unity3D之Mecanim动画系统学习笔记(十):Mecanim动画的资源加载相关
资源加载是必备的知识点,这里就说说Mecanim动画的资源如何打包及加载. 注意,Unity4.x和Unity5.x的AssetBundle打包策略不一样,本笔记是基于Unity4.x的AssetBu ...
- CSS 的 appearance 属性
在 Firefox 1.0+,Chrome 1.0+ 和 Safari 3.0+ 中,我们可以使用 -moz-appearance 或者 -webkit-appearance 属性让元素模仿系统原生控 ...
- MyEclipse10.0 安装 jbpm4.4
马上送上地址:http://sourceforge.net/projects/jbpm/files/jBPM%204/ 偶这里下载的是 jbpm4.4 如图: 1.点击 add site 2.点击 a ...
- Mybatis学习之配置文件
Mybatis也是ORM框架的一种,与Hibernate框架的不同就是Hibernate框架是实体与表的映射,是一种全自动的ORM实现,而Mybatis是实体与sql语句的映射,是一种半自动的ORM映 ...