web前端面试题 什么是 css hack
一般来说是针对不同的浏览器写不同的
CSS,就是
CSS Hack。 IE浏览器
Hack一般又分为三种,条件
Hack、属性级
Hack、选择符
Hack(详细参考
CSS文档:
css文档)。例如: // 1、条件
Hack // 2、属性
Hack .test{ color:#0909; / For IE8+ / color:#f00; / For IE7 and earlier / _color:#ff0; / For IE6 and earlier */ } // 3、选择符
Hack html .test{color:#090;} / For IE6 and earlier / html .test{color:#ff0;} / For IE7 / 6、简述同步和异步的区别 同步是阻塞模式,异步是非阻塞模式。 同步就是指一个进程在执行某个请求的时候,若该请求需要一段时间才能返回信息,那么这个进程将会一直等待下去,直到收到返回信息才继续执行下去; 异步是指进程不需要一直等下去,而是继续执行下面的操作,不管其他进程的状态。当有消息返回时系统会通知进程进行处理,这样可以提高执行的效率。
怎样找css hack 的最新使用方法
1.IE条件注释法 该方法安全性好,但是不利于开发维护。比如涉及到针对不同版本IE的
css。 只在IE下有效 只在IE6有效 只在IE6以上版本有效 注意:结合lte、lt、gte、gt、!关键字使用。 2.选择符前缀法 “*html” 前缀只对IE6生效 "*+html"前缀只对IE7生效
CSS Code复制内容到剪贴板 .test{width:80px;} /*IE 6 7 8*/ *html .test{width:70px;} /*IE6*/ *+html .test{width:60px;}/*IE7*/ 缺点:不能保证IE9,10不识别*html,*+html,有向后兼容风险。 3.样式属性前缀法: 如“_”只在IE6下生效,“*”在IE6和IE7下生效。同样有向后兼容隐患。 .test{width:80px;*width:70px;_width:60px;} 可用于内联样式
CSS Code复制内容到剪贴板 :
由于IE条件注释法不利于开发维护,实际中常用的
hack方法常常是后两者。 小例子 html 代码 XML/HTML Code复制内容到剪贴板
您的浏览器是
css hack 代码
CSS Code复制内容到剪贴板 p { margin:0; padding:0 55px 0 0; height:30xp; line-height:30px; font-size:14px;} p { background:url(llq.gif) 90px -170px no-repeat;} /* all */ p,x:-moz-any-link { background:url(llq.gif) 90px -80px no-repeat;} /* for ff */ p,x:-moz-any-link,x:default { background:url(llq.gif) 90px -140px no-repeat;} /* for ff2+ */ p {[;background:url(llq.gif) 90px -260px no-repeat;]} /* for sa/ch */ p { background:url(llq.gif) 90px -50px no-repeat9;} /* for ie */ *+html p { background:url(llq.gif) 90px -20px no-repeat;} /* only for ie7 */ p { _background:url(llq.gif) 90px 10px no-repeat;} /* only for ie6 */ 查看Demo 因为没有找到 op10 的
css hack,所以标准的写法是给 op10 的,然后针对其他浏览器写
css hack。 另外,在修复过程中,发现了网上流传的一个
css hack 有问题,这个
css hack 也许有很多人在用,就是[属性:值 ],有的人说这是 ie8 专用的,但我在测试过程中发现这个
css hack 除了 ie8 识别外,ff3 和 op10 也能识别(ff2 和 ff3.5 不能识别)。
一个css hack 问题
方法一:使用overflow:auto; 高度不够,让滚动条自动出来,默认没有滚动条。
方法二:针对IE6的hack: _overflow:hidden; 。
如何用css hack区分各种主流浏览器,以宽度为例:(width:100px)
/*IE7 only*/ *+html .foo{ width:100px } /* IE6 and below */* html .foo(width:100px} /* IE8,IE9,FF,OPERA ... */.foo {width:100px }
什么是Css Hack?ie6,7,8的hack分别是什么
针对不同的浏览器写不同的
CSS code 的过程,就是
CSS hack。
示例如下:
#test{
Width:300px;
Height:300px;
background-color:blue
}
#test{
width:300px;
height:300px;
background-color:blue; /*firefox*/
background-color:red9; /*all ie*/
background-color:yellow; /*ie8*/
+background-color:pink; /*ie7*/
_background-color:orange; /*ie6*/ }
:root #test { background-color:purple9; } /*ie9*/
@media all and (min-width:0px)
{ #test {background-color:black;} } /*opera*/
@media screen and (-webkit-min-device-pixel-ratio:0)
{ #test {background-color:gray;} } /*chrome and safari*/
怎样用css hack针对IE的优化??
有些时候,你需要对IE浏览器的bug定义一些特别的规则,这里有太多的CSS技巧(hacks),我只使用其中的两种方法,这两种方法都是最安全的。
1、注释的方法 (a)在IE中隐藏一个CSS定义,你可以使用子选择器(child selector): html>body p { /* 定义内容 */ } (b)下面这个写法只有IE浏览器可以理解(对其他浏览器都隐藏) * html p { /* declarations */ } (c)还有些时候,你希望IE/Win有效而IE/Mac隐藏,你可以使用"反斜线"技巧: /* */ * html p { declarations } /* */ 2、条件注释(ments)的方法 另外一种方法,我认为比CSS Hacks更加经得起考验就是采用微软的私有属性条件注释(ments)。用这个方法你可以给IE单独定义一些样式,而不影响主样式表的定义。就象这样:
<!--[if IE]> <link rel="stylesheet" type="text/css" href="ie.css" /> <![endif]-->
希望对你有帮助!!!
CSS中的hack求讲解!!!
CSS的
hack 就是针对不同的浏览器,写不同的
CSS,利用浏览器的一些特性去分开。但是尽量不要用,后期不好维护
问什么要少用css hack
css hack是为页面在不同内核浏览器获得较为一致的表现效果时的一种辅助手段。当我们的页面html结构和
css样式书写都很符合web标准时,页面在良好支持web标准的浏览器下一般是不需要
css hack的,正是由于对web标准支持不够良好的浏览器的存在才有
css hack的产生,根源清楚了,微软也在推进彻底放弃IE6,大家都在朝web标准努力,自然对
css hack这个衍生物也是用越少越好咯
css hack
CSS hack 是
CSS中的一种作弊手段,因为目前所有浏览器并没有统一对
CSS的支持,例如同样是一个margin:1px,可能在不同的浏览器中出现的效果就一定是1px 在这种情况下,我们只能借助于
CSS hack来暂时过渡这个阶段,
CSS hack就比如是IE能认出的
CSS语句,而FF不能认出,这样就能达到我们的目的了,
css hack在很多高级的技巧中出现,不过并不是很推荐使用,毕竟未来的
css趋势还不是很明了,尽量避免吧 因为很多
css错位问题其实并不是浏览器的错误,而是我们本身的编辑出现的错误。 关于
css hack更详细的说明,在
CSS黑板报上有更详细的 可以直接百度:
CSS黑板报,第一个就是了。加油!
css hack简单来解释是什么意思
hack是对不同厂商的浏览器,不同的渲染结果进行一个统一化的补丁的意思, 比如:IE,friefox,chorme几个不同核心的浏览器,对某一些
CSS样式,渲染的结果是会出现不同的,就是同一个
CSS,在三个浏览器上看,看到的效果不一样。为了统一化就需要针对某一个浏览器,专门写一些
CSS,这就是
CSS HACK的意思了。 也可以是针对 不同浏览器,我想要不同的效果,也可以针对不同的浏览器写样式。比如: -webkit -moz -ms -o 加上厂商前缀,
关于CSShack,有知道的来拿分
用于IE浏览器的条件注释,常用于
CSShack,针对IE的JS等! :就是不等于的意思,跟javascript里的不等于判断符相同, 1,条件注释的基本结构和HTML的注释()是一样的。因此IE以外的浏览器将会把它们看作是普通的注释而完全忽略它们。 2,IE将会根据if条件来判断是否如解析普通的页面内容一样解析条件注释里的内容。 3,条件注释使用的是HTML的注释结构,因此他们只能使用在HTML文件里,而不能在
CSS文件中使用。 具体的看这里 /68466896/blog/item/d255d7a96585e6fb1e17a2d8.html
关于CSS hack的写法
我来给您解答~
<style>
#example{color:red ;}/*firefox*/ * html #example{color:blue;}/*ie6*/ *+html #example{color:green;}/*ie7*/ #example{color:yellow ;}/*ie8*/
</style>
或者简写成
#example{border:1px solid red;+ border:1px solid green;_border:1px solid blue;border:1px solid yellow ;}
还可简写成
#example{border:1px solid red!important;*border:1px solid green;border:1px solid yellow ;}/*这样写是指,FF和IE是一样的效果 取red,iIE取green,I8取yellow ,如果不加!important,只有FF取red,ie6和ie7取green,IE8取yellow*/
CSS hack 如何写,使得只有IE8识别,IE6/7不识别
没有IE7和IE8的HACK
主流的做法是将IE8设置为兼容显示IE7
like this:
<meta http-equiv="X-UA-Compatible" content="IE=7" />
CSS HACK什么意思,代表什么啊
什么是
CSS hack( /
css-
hack/index.html)由于不同的浏览器,比如 Explorer 6, Explorer 7,Mozilla Firefox等,对
CSS的解析认识不一样,因此会导致生成的页面效果不一样,得不到我们所需要的页面效果。 这个时候我们就需要针对不同的浏览器去写不同的
CSS,让它能够同时兼容不同的浏览器,能在不同的浏览器中也能得到我们想要的页面效果。 这个针对不同的浏览器写不同的
CSS code的过程,就叫
CSS hack,也叫写
CSS hack。
CSS Hack的原理是什么 由于不同的浏览器对
CSS的支持及解析结果不一样,还由于
CSS中的优先级的关系。我们就可以根据这个来针对不同的浏览器来写不同的
CSS。 比如 IE6能识别下划线"_"和星号" * ",IE7能识别星号" * ",但不能识别下划线"_",而firefox两个都不能认识。等等 书写顺序,一般是将识别能力强的浏览器的
CSS写在后面。下面如何写里面说得更详细些。 如何写
CSS Hack 比如要分辨IE6和firefox两种浏览器,可以这样写: 我在IE6中看到是红色的,在firefox中看到是绿色的。 解释一下: 上面的
css在firefox中,它是认识不了后面的那个带星号的东东是什么的,于是将它过滤掉,不予理睬,解析得到的结果是:div{background:green},于是理所当然这个div的背景是绿色的。 在IE6中呢,它两个background都能识别出来,它解析得到的结果是:div{background:green;background:red;},于是根据优先级别,处在后面的red的优先级高,于是当然这个div的背景颜色就是红色的了。
CSS hack:区分IE6,IE7,firefox 区别不同浏览器,
CSS hack写法: 区别IE6与FF: background:orange;*background:blue; 区别IE6与IE7: background:green !important;background:blue; 区别IE7与FF: background:orange; *background:green; 区别FF,IE7,IE6: background:orange;*background:green;_background:blue; background:orange;*background:green !important;*background:blue; 注:IE都能识别*;标准浏览器(如FF)不能识别*; IE6能识别*,但不能识别 !important, IE7能识别*,也能识别!important; FF不能识别*,但能识别!important; IE6 IE7 FF * √ √ × !important × √ √ 浏览器优先级别:FF
CSS资料参考 / 玩转CSS - CSSPLAY中文官方网站 一个致力于中国CSS技术的公益组织css hack 中样式前面有个星号“*” 是什么hack啊?
CSS hack 用来让网页兼容各种浏览器(在各种环境下都能“正确的”显示)举例:如*+html 与 *html *+html 与 *html是IE特有的标签, firefox 暂不支持.而*+html 又为 IE7特有标签.所以*+html 样式只在IE7下面有效,兼容ie7如果是 *html 这种样式 是兼容 ie6本问题由中关村北大青鸟论坛团队整理回答什么是Hack技术?
Hack技术是基于开源的程序的基础,对其代码进行增加、删除或者修改、优化,使之在功能上符合新的需求,是一种黑客技术。 由于基础是开源免费的,一般的Hack也都是开源免费的,许多程序爱好者会根据自己或者朋友的需求,去制作一些小Hack在各个程序的官方交流论坛发布(比如动网的hack就会发布在动网的交流论坛的插件区),以获得站长们和官方的肯定和鼓励。 扩展资料 区别: Hack大多和插件混为一谈,其实二者是有很大区别的:插件一般是利用程序的API(接口),复用程序底层,利用一些程序既有的函数和类制作新的小作品,一般有文件的增加,且符合标准的插件,其目录结构和文件名都是有一定格式的(如Discuz!的插件文件需放在plugin目录下)。 而Hack则是针对原程序文件的直接修改,在格式上也自然没有太严格的规定,且一般没有文件的增加。 参考资料:搜狗百科-hack有没有只支持chrome css hack啊!
虽然firefox和chrome不一样,但是大部分CSS都相同,目前我只碰到过一次(基本上我是不看firefox的-_-!!),还是可以兼容的,只是多写了一个属性,下面是我转来的,虽然说太多了,不过看完估计对你有用,后面还有一些兼容技巧 CSS兼容IE6,IE7和FF的总结(3-11) CSS hack:针对IE6,IE7,firefox显示不同效果 做网站时经常会用到,衡量一个DIV+CSS架构师的水平时,这个也很重要。 区别不同浏览器的CSS hack写法: 区别IE6与FF: background:orange;*background:blue; 区别IE6与IE7: background:green !important;background:blue; 区别IE7与FF: background:orange; *background:green; 区别FF,IE7,IE6: background:orange;*background:green !important;*background:blue; 注:IE都能识别*;标准浏览器(如FF)不能识别*; IE6能识别*,但不能识别 !important, IE7能识别*,也能识别!important; FF不能识别*,但能识别!important;IE6 IE7 FF * √ √ × !important × √ √ ------------------------------------------------------ 另外再补充一个,下划线"_", IE6支持下划线,IE7和firefox均不支持下划线。 IE6 IE7 FF * √ √ × !important × √ √ _ √ × × 于是大家还可以这样来区分IE6,IE7,firefox : background:orange;*background:green;_background:blue; 注:不管是什么方法,书写的顺序都是firefox的写在前面,IE7的写在中间,IE6的写在最后面。 一、CSS HACK 以下两种方法几乎能解决现今所有HACK. 1, !important 随着IE7对!important的支持, !important 方法现在只针对IE6的HACK.(注意写法.记得该声明位置需要提前.) <stylegt; #wrapper { width: 100px!important; /* IE7+FF */ width: 80px; /* IE6 */ } </stylegt; 2, IE6/IE7对FireFox *+html 与 *html 是IE特有的标签, firefox 暂不支持.而*+html 又为 IE7特有标签. <style> #wrapper { #wrapper { width: 120px; } /* FireFox */ *html #wrapper { width: 80px;} /* ie6 fixed */ *+html #wrapper { width: 60px;} /* ie7 fixed, 注意顺序 */ } </style> 注意: *+html 对IE7的HACK 必须保证HTML顶部有如下声明: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "/TR/html4/loose.dtd"> 二、万能 float 闭合(非常重要!) 关于 clear float 的原理可参见 [How To Clear Floats Without Structural Markup] 将以下代码加入Global CSS 中,给需要闭合的div加上 ><style> /* Clear Fix */ .clearfix:after { content:"."; display:block; height:0; clear:both; visibility:hidden; } .clearfix { display:inline-block; } /* Hide from IE Mac */ .clearfix {display:block;} /* End hide from IE Mac */ /* end of clearfix */ </style> 关于闭合浮动元素(clearing float)的方法现在已经很多了,个人认为简单实用的方法就是使用:after伪类动态的嵌入一个用于清除浮动的元素,可惜代码量太大了,看上去不够简洁。 现在看到有个方法超级简单。介绍一下这个方法。原文在:] <div id="wrap"> <div class="column_left"> <h1>Float left</h1> </div> <div class="column_right"> <h1>Float right</h1> </div> </div> CSS样式: Example Source Code [ww w.52css] #wrap{ border:6px c solid; overflow:auto; _height:1%;} .column_left{ float:left; width:20%; padding:10px;} .column_right{ float:right; width:75%; padding:10px; border-left:6px #eee solid;} 三、其他兼容技巧(再次啰嗦) 1, FF下给 div 设置 padding 后会导致 width 和 height 增加, 但IE不会.(可用!important解决) 2, 居中问题. 1).垂直居中.将 line-height 设置为 当前 div 相同的高度, 再通过 vertical-align: middle.( 注意内容不要换行.) 2).水平居中. margin: 0 auto;(当然不是万能) 3, 若需给 a 标签内内容加上 样式, 需要设置 display: block;(常见于导航标签) 4, FF 和 IE 对 BOX 理解的差异导致相差 2px 的还有设为 float的div在ie下 margin加倍等问题. 5, ul 标签在 FF 下面默认有 list-style 和 padding . 最好事先声明, 以避免不必要的麻烦. (常见于导航标签和内容列表) 6, 作为外部 wrapper 的 div 不要定死高度, 最好还加上 overflow: hidden.以达到高度自适应. 7, 关于手形光标. cursor: pointer. 而hand 只适用于 IE. 1 针对firefox ie6 ie7的css样式 现在大部分都是用!important来hack,对于ie6和firefox测试可以正常显示, 但是ie7对!important可以正确解释,会导致页面没按要求显示!找到一个针 对IE7不错的hack方式就是使用“*+html”,现在用IE7浏览一下,应该没有问题了。 现在写一个CSS可以这样: #1 { color: #333; } /* Moz */ * html #1 { color: #666; } /* IE6 */ *+html #1 { color: #999; } /* IE7 */ 那么在firefox下字体颜色显示为#333,IE6下字体颜色显示为#666,IE7下字体颜色显示为#999。 2 css布局中的居中问题 主要的样式定义如下: body {TEXT-ALIGN: center;} #center { MARGIN-RIGHT: auto; MARGIN-LEFT: auto; } 说明: 首先在父级元素定义TEXT-ALIGN: center;这个的意思就是在父级元素内的内容居中;对于IE这样设定就已经可以了。 但在mozilla中不能居中。解决办法就是在子元素定义时候设定时再加上“MARGIN-RIGHT: auto;MARGIN-LEFT: auto; ” 需要说明的是,如果你想用这个方法使整个页面要居中,建议不要套在一个DIV里,你可以依次拆出多个div, 只要在每个拆出的div里定义MARGIN-RIGHT: auto;MARGIN-LEFT: auto; 就可以了。 3 盒模型不同解释. #box{ width:600px; //for ie6.0- width:500px; //for ff+ie6.0} #box{ width:600px!important //for ff width:600px; //for ff+ie6.0 width /**/:500px; //for ie6.0-} 4 浮动ie产生的双倍距离 #box{ float:left; width:100px; margin:0 0 0 100px; //这种情况之下IE会产生200px的距离 display:inline; //使浮动忽略} 这里细说一下block,inline两个元素,Block元素的特点是:总是在新行上开始,高度,宽度,行高,边距都可以控制(块元素);Inline元素的特点是:和其他元素在同一行上,...不可控制(内嵌元素); #box{ display:block; //可以为内嵌元素模拟为块元素 display:inline; //实现同一行排列的的效果 diplay:table; 5 IE与宽度和高度的问题 IE不认得min-这个定义,但实际上它把正常的width和height当作有min的情况来使。这样问题就大了,如果只用宽度和高度, 正常的浏览器里这两个值就不会变,如果只用min-width和min-height的话,IE下面根本等于没有设置宽度和高度。 比如要设置背景图片,这个宽度是比较重要的。要解决这个问题,可以这样: #box{ width: 80px; height: 35px;}html>body #box{ width: auto; height: auto; min-width: 80px; min-height: 35px;} 6 页面的最小宽度 min-width是个非常方便的CSS命令,它可以指定元素最小也不能小于某个宽度,这样就能保证排版一直正确。但IE不认得这个, 而它实际上把width当做最小宽度来使。为了让这一命令在IE上也能用,可以把一个<div> 放到 <body> 标签下,然后为div指定一个类: 然后CSS这样设计: #container{ min-width: 600px; width:expression(document.body.clientWidth < 600? "600px": "auto" );} 第一个min-width是正常的;但第2行的width使用了Javascript,这只有IE才认得,这也会让你的HTML文档不太正规。它实际上通过Javascript的判断来实现最小宽度。 7 清除浮动 .hackbox{ display:table; //将对象作为块元素级的表格显示}或者.hackbox{ clear:both;} 或者加入:after(伪对象),设置在对象后发生的内容,通常和content配合使用,IE不支持此伪对象,非Ie 浏览器支持, 所以并不影响到IE/WIN浏览器。这种的最麻烦的......#box:after{ content: "."; display: block; height: 0; clear: both; visibility: hidden;} 8 DIV浮动IE文本产生3象素的bug 左边对象浮动,右边采用外补丁的左边距来定位,右边对象内的文本会离左边有3px的间距. #box{ float:left; width:800px;}#left{ float:left; width:50%;}#right{ width:50%;}*html #left{ margin-right:-3px; //这句是关键} HTML代码<div id="box"> <div id="left"></div> <div id="right"></div></div> 9 属性选择器(这个不能算是兼容,是隐藏css的一个bug) p[id]{}div[id]{} 这个对于IE6.0和IE6.0以下的版本都隐藏,FF和OPera作用 属性选择器和子选择器还是有区别的,子选择器的范围从形式来说缩小了,属性选择器的范围比较大,如p[id]中,所有p标签中有id的都是同样式的. 10 IE捉迷藏的问题 当div应用复杂的时候每个栏中又有一些链接,DIV等这个时候容易发生捉迷藏的问题。 有些内容显示不出来,当鼠标选择这个区域是发现内容确实在页面。 解决办法:对#layout使用line-height属性 或者给#layout使用固定高和宽。页面结构尽量简单。 11 高度不适应 高度不适应是当内层对象的高度发生变化时外层高度不能自动进行调节,特别是当内层对象使用 margin 或padding 时。 例: <div id="box"> p对象中的内容 </div> CSS:#box {background-color:#eee; } #box p {: 20px;margin-bottom: 20px; text-align:center;} 解决方法:在P对象上下各加2个空的div对象CSS代码:.1{height:0px;overflow:hidden;}或者为DIV加上border属性。css中hack如何使用?举个例子
就是CSS代码,直接放到CSS文件中就可以了
CSS hack由于不同的浏览器,比如 Explorer 6, Explorer 7,Mozilla Firefox等,对CSS的解析认识不一样,因此会导致生成的页面效果不一样,得不到我们所需要的页面效果。 这个时候我们就需要针对不同的浏览器去写不同的CSS,让它能够同时兼容不同的浏览器,
css的hack
您已经走进一个误区了,CSS hack是什么?你理解了吗?随着W3C和HTML5的推进,CSS hack将会用的越来越少。刚学的时候因为不了解各个浏览器的渲染和盒子模型,可能需要大量的Hack来完善网页。但是越到后来你会发现你可以基本上不用一个hack就可以做好一个兼容性很强的网页了!征集各种CSS HACK问题
方法一: 跨浏览器的网页设计一直是让人很头疼的问题,这不只是因为浏览器的版本众多,还有一个重要的原因是相同浏览器的不同时期的版本也会有差异,甚至是在不同操作同台上还会有不同。因此使CSS hack技术进行浏览器区分是实现跨浏览器访问一个好方法。CSS Hack技术有很多,具体可以查看:
本文据说的主要是通过“.”,“>”,“*”,“_”来区分。以下是本人对这四种符号的测试结果: ———————IE6—— IE7——IE8——FF2——FF3— Opera9.5 >property—— Y—— Y—— Y—— N—— N—— N .property—— Y—— Y—— Y—— N—— N—— N *property—— Y—— Y—— Y—— N—— N—— N _property—— Y—— N—— N—— N—— N—— N
我们可以看到>property、.property、*property在各浏览器中的表现是一致的,只有_property在IE6和IE7、IE8中有所区别。另外还要注意的,IE6是不支持!important的,而其他几款浏览器都识别。
举例: 要对想同的文字在不同浏览器中显示不同的颜色可以使用: color:brown !important; /*用于Opera、Firefox2、Firefox3等现代浏览器*/ >color:green !important; /*IE7、IE8可以识别该规则,因此它覆盖掉了上一条规则*/ color:red; /*所有浏览器都可以识别,但是以上两条规则有!important,所以这条规则被忽视;只有IE6认识并覆盖掉上两条规则*/
color:brown !important; /*用于Opera、Firefox2、Firefox3等现代浏览器*/ >color:green !important; /*IE7、IE8可以识别该规则,因此它覆盖掉了上一条规则*/ color:red; /*所有浏览器都可以识别,但是以上两条规则有!important,所以这条规则被忽视;只有IE6认识并覆盖掉上两条规则*/因此这就实现了跨浏览器的表现问题。_property和*property也是一样的。对于_property来说,只有IE6才能识别,因此可以用于单独对IE6的设置中。
不过这里要注意书写的顺序:现在浏览器的写法要写在最前面,IE6的写法要写在最后面用于覆盖,其他浏览器写在中间。 方法二: 其实主要是浏览器:IE6/IE7/firefox下,各个对CSS代码的解释有区别,下边转载一篇HACK的文章,相当实用。
区别IE6与FF: background:orange;*background:blue;
区别IE6与IE7: background:green !important;background:blue;
区别IE7与FF: background:orange; *background:green;
区别FF/IE7/IE6: background:orange;*background:green !important;*background:blue;
注:IE都能识别*标准浏览器(如FF)不能识别* IE6能识别*,但不能识别 !important IE7能识别*,也能识别!important FF不能识别*,但能识别!important
另外再补充一个,下划线"_", IE6支持下划线,IE7和firefox均不支持下划线。(推荐.我这只有这个有效!)
于是大家还可以这样来区分IE6、IE7、firefox : background:orange;*background:green;_background:blue;
* html p {color:#f00;} 支持 IE6 不支持FF IE7 IE8b
*+html p {color:#f00;} 支持 IE7 IE8b 不支持FF IE6
p {*color:#f00;} 支持 IE7 IE6 不支持FF IE8
注:不管是什么方法,书写的顺序都是firefox的写在前面,IE7的写在中间,IE6的写在后面。
本文来自CSDN博客,转载请标明出处: /rat9912345/archive/2009/11/01/4753067.aspx
CSS Hack 是什么意思
CSS hack由于不同厂商的浏览器,比如 Explorer,Safari,Mozilla Firefox,Chrome等,或者是同一厂商的浏览器的不同版本,如IE6和IE7,对CSS的解析认识不完全一样,因此会导致生成的页面效果不一样,得不到我们所需要的页面效果。 这个时候我们就需要针对不同的浏览器去写不同的CSS,让它能够同时兼容不同的浏览器,能在不同的浏览器中也能得到我们想要的页面效果。 简单的说,CSS hack的目的就是使你的CSS代码兼容不同的浏览器。当然,我们也可以反过来利用CSS hack为不同版本的浏览器定制编写不同的CSS效果。 CSS Hack大致有3种表现形式,CSS类内部Hack、选择器Hack以及HTML头部引用(if IE)Hack,CSS Hack主要针对类内部Hack:比如 IE6能识别下划线"_"和星号" * ",IE7能识别星号" * ",但不能识别下划线"_",而firefox两个都不能认识。等等什么是css hack css hack是什么
CSS hack由于不同厂商的浏览器,比如 Explorer,Safari,Mozilla Firefox,Chrome等,或者是同一厂商的浏览器的不同版本,如IE6和IE7,对CSS的解析认识不完全一样,因此会导致生成的页面效果不一样,得不到我们所需要的页面效果。 这个时候我们就需要针对不同的浏览器去写不同的CSS,让它能够同时兼容不同的浏览器,能在不同的浏览器中也能得到我们想要的页面效果。 简单的说,CSS hack的目的就是使你的CSS代码兼容不同的浏览器。当然,我们也可以反过来利用CSS hack为不同版本的浏览器定制编写不同的CSS效果。CSS hack safari 只对safari管用
.main{margin-left:160px;min-height:500px;overflow:hidden;[;margin-left:0;]/*safari?hack*/}css常见的hack方法有哪些
CSS Hack大致有3种表现形式,CSS属性前缀法、选择器前缀法以及IE条件注释法(即HTML头部引用if IE)Hack,实际项目中CSS Hack大部分是针对IE浏览器不同版本之间的表现差异而引入的。 属性前缀法(即类内部Hack):例如 IE6能识别下划线"_"和星号" * ",IE7能识别星号" * ",但不能识别下划线"_",IE6~IE10都认识"9",但firefox前述三个都不能认识。 选择器前缀法(即选择器Hack):例如 IE6能识别*html .class{},IE7能识别*+html .class{}或者*:first-child+html .class{}。 IE条件注释法(即HTML条件注释Hack):针对所有IE(注:IE10+已经不再支持条件注释): <!--[if IE]>IE浏览器显示的内容 <![endif]-->,针对IE6及以下版本: <!--[if lt IE 6]>只在IE6-显示的内容 <![endif]-->。这类Hack不仅对CSS生效,对写在判断语句里面的所有代码都会生效。 具体不展开,可看资料搜索“史上最全的CSS hack方式一览”如何写CSS hack,如何解决浏览器兼容问题?
建议你用!inprotant,我的hack都是用的这个,!important在E6中是不识别的,而在其他浏览器中能提高优先级。给你个实例: #why{width:200px; width:195px!important;..........}在这里面后面的width被加了个!important,提高了优先级,除IE6及以下版本外的其他浏览器能识别,根据后置优先原则,在除IE6及以下版本外的其他浏览器中,width被解释成195px;而在IE中则解释成200px;同理可以解决其他部分问题。希望对你有用!怎么让DIV+CSS兼容各种浏览器 而不必写烦人的CSS HACK?
在ps里量好像素。子容器不要和父容器一样100%,宽度设99%。一般写得多就知道怎么写,有技巧的
发前我写经常用到hack。现在知道技巧。基本不用hack也能正常
什么叫做css hack
css hack就是 由于不同厂商的流览器或某浏览器的不同版本(如IE6-IE11,Firefox/Safari/Opera/Chrome等),对CSS(层叠样式)的支持、解析不一样,导致在不同浏览器的环境中呈现出不一致的页面展现效果。这时,我们为了获得统一的页面效果,就需要针对不同的浏览器或不同版本写特定的CSS样式,我们把这个针对不同的浏览器/不同版本写相应的CSS code的过程,叫做CSS hack。