CSS Hank兼容浏览器的

color:red; /* 所有浏览器都支持 */
color:red !important; /* 除IE6外 */
_color:red; /* IE6支持 */
*color:red; /* IE6、IE7支持 */
+color:red; /*IE7支持*/
*+color:red; /* IE7支持 */
color:red\9; /* IE6、IE7、IE8、IE9支持 */
color:red\; /* 针对所有IE */
color:red\0; /* IE8、IE9支持 */
color:red\9\0; /*IE9支持*/
:root .test { color:red\0; }  /*IE9支持*/
/* webkit and opera */
@media all and (min-width: 0px){ div{color:red;} }
/* webkit */
@media screen and (-webkit-min-device-pixel-ratio:0){ div{color:red;} }
/* opera */
@media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0) { div{color:red;} }
/* firefox * /
@-moz-document url-prefix(){ div{color:red;} } /* all firefox */
html>/**/body div, x:-moz-any-link, x:default {color:red;} /* newest firefox */
body:nth-of-type(1) p{color:red;} /* Chrome、Safari支持 */
<!--[if lt IE 7 ]> <html class="ie6"> <![endif]-->
<!--[if IE 7 ]> <html class="ie7"> <![endif]-->
<!--[if IE 8 ]> <html class="ie8"> <![endif]-->
<!--[if IE 9 ]> <html class="ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html> <!--<![endif]-->
<!-[if IE 7]> = 等于 IE7
<!-[if lt IE 8]> = 小于 IE8(就是 IE7 或以下了啦)
<!-[if gte IE 8]> = 大于或等于 IE8
<meta http-equiv="x-ua-compatible" content="ie=7" />
把这段代码放到<head>里面,在ie8里面的页面解析起来就跟ie7一模一样的了
<!-[if IE]>
<link rel="stylesheet" href="/ie-all.css" type="text/css" media="screen" />
<![endif]->
<!-[if lt IE 8]>
<link rel="stylesheet" href="/ie.css" type="text/css" media="screen" />
<![endif]->
<!-[if IE 7]>
<link rel="stylesheet" href="/ie7.css" type="text/css" media="screen" />
<![endif]->
<!-[if IE 6]>
<link rel="stylesheet" href="/ie6.css" type="text/css" media="screen" />
<![endif]->
时间: 2024-09-14 10:30:49

CSS Hank兼容浏览器的的相关文章

css代码兼容浏览器技巧总结

  解决CSS的浏览器兼容性问题,多年切图工作的总结:) /* 统一各个浏览器下 外边距margin.内填充padding的默认值 */ html,body,a,h1,h2,h3,h4,h5,h6,p,div,ul,li,ol,dl,dt,dd,img,form,input,textarea,select,fieldset { margin:0px; padding:0px } /* 统一标题公共样式 text-shadow:gray 0px 0px 5px; 文字阴影 font-weight:

Google浏览器CSS居中兼容问题完美解决方法

在IE内核浏览器或者firefox浏览器中都能居中,没有居中的可以用其特殊标签来设定居中可是在谷歌浏览器查看时就出现无法居中的BUG,下面的解决方法有类似情况的朋友可以参考下   div做的界面时,又出现CSS hack(CSS兼容浏览器问题)在IE内核浏览器或者firefox浏览器中都能居中,没有居中的可以用其特殊标签来设定居中,如下划线 _ IE6优先识别,!important 仅火狐firefox浏览器识别.可是在谷歌浏览器查看时,就出现兼容Google浏览器的BUG了,无法居中. 现在向

总结CSS中火狐浏览器与IE浏览器的兼容代码

总结CSS中火狐浏览器与IE浏览器的兼容代码,兼容你兼容主要是语法规范问题,你写CSS写规范了,就都兼容了,其他的就是一些浏览器的BUG了,发一些技巧给你看看,或许有用. CSS技巧 1.div的垂直居中问题 vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然后插入文字,就垂直居中了.缺点是要控制内容不要换行 2.margin加倍的问题 设置为float的div在ie下设置的margin会加倍.这是一个ie6都存在的bug.解决

DIV+CSS网页兼容所有主流浏览器技巧(IE6/IE7/IE8/IE9/Firefox/Chrome)

CSS兼容常用技巧 请尽量用xhtml严格格式写代码,一定要加DOCTYPE声明,因为DOCTYPE影响CSS处理,影响W3C标准. 1.div中文字的垂直居中问题 vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然后插入文字,就垂直居中了.缺点是要控制内容不要换行 2. margin加倍的问题 设置为float的div在ie下设置的margin会加倍.这是一个ie6都存在的bug.解决方案是在这个div里面加上display:

关于css中不同浏览器兼容详解(1/6)

由于浏览器的开发商越来越多,关于css教程兼容也是各位设计师,站长们讨论的热门话题了,下面我们总结了一些学用中的css兼容问题的. 1.div的垂直居中问题 vertical-align:middle;将行距增加到和整个div一样高line-height:200px;然后插入文字,就垂直居中了.缺点是控制内容不要换行 2 margin加倍的问题 设置为float的div在ie下设置的matgin会加倍.这是ie6都存在的bug.解决方案是在这个div里面加上display:inline;例如 <

[转]CSS完美兼容IE6/IE7/FF的通用方法

关于CSS对各个浏览器兼容已经是老生常谈的问题了, 网络上的教程遍地都是.以下内容没有太多新颖, 纯属个人总结, 希望能对初学者有一定的帮助. 一.CSS HACK 以下两种方法几乎能解决现今所有HACK. 1, !important 随着IE7对!important的支持, !important 方法现在只针对IE6的HACK.(注意写法.记得该声明位置需要提前.) <style> #wrapper { width: 100px!important; /* IE7+FF */ width:

【转】css解决兼容的问题

css解决兼容的问题   2007-08-16 21:06    阅读    评论 字号: css解决兼容的问题1:float的闭合在float元素间增加一个标记<div class=clear></div>这个样式定义为:.clear{ clear:both;}2:最好的div居中方法.someStyle{ width:xpx; margin:xpx auto;} 3:strong标签重写的好处对于特定的内容,如果要进行强调,又需要设置自己的样式,可以不必另行定义div,而用st

CSS hack实现 CSS完美兼容IE6/IE7/FF的通用方法_经验交流

关于CSS对各个浏览器兼容已经是老生常谈的问题了, 网络上的教程遍地都是.以下内容没有太多新颖, 纯属个人总结, 希望能对初学者有一定的帮助. 一.CSS HACK 以下两种方法几乎能解决现今所有HACK. 1, !important 随着IE7对!important的支持, !important 方法现在只针对IE6的HACK.(注意写法.记得该声明位置需要提前.) <style> #wrapper { width: 100px!important; /* IE7+FF */ width: 

html5+CSS3创建兼容浏览器的range input 对象

随着IE10的发布,我们给range input创建样式的能力已经得到了引人注目提高.用纯CSS实现跨浏览器兼容的range input(sliders)已经成为可能.在这篇教程中,我们用基本的range input作为例子:     然后把它变成:     为了简化生成跨浏览器兼容的样式的过程,我们引进LESS.当然也有CSS版本. 添加基础CSS样式 我们需要给range input添加几个样式来覆盖所有浏览器的默认外观. input[type=range] {   -webkit-appe