认识css常见的hack

TangSir      2022-02-14     403

关键词:

一、认识css hack

CSS Hack只要是来解决浏览器局部的兼容性问题,主要是因为每个浏览器对css的解析各不相同,导致输出到页面的效果的差异;

二、css hack的三种常见形式:css属性hack,css选择符hack和css针对IE浏览器的条件注释hack

      1、css属性hack:比如IE6能识别"_"和"*",IE7能识别"*"但不能识别"_";

      2、选择符级Hack:IE6能识别*html .class{} IE7能识别*+html .class{}或者*:html .class{};

      3、针对ie的条件注释Hack:比如针对所有IE:<!–[if IE]><!–您的代码–><![endif]–>针对IE6及以下版本:<!–[if lt IE 7]><!–您的代码–><![endif]–>,此时写在判断力的代码都生效。

三、hack例子

      1、CSS属性级Hack

           color:red; /*所有浏览器*/    _color:red; /*仅IE6*/    *color:red; /*IE6和IE7*/  +color:red; /*仅IE6*/   color:red; /* IE8、IE9 识别*/ color:red9; /* 仅IE9识别 */    color:red!important; /* IE6 不识别!important*/

      2、CSS选择符级Hack

           *html #container { color:red;} /* 仅IE6 识别 */    *+html #container { color:red;} /* 仅IE7 识别 */

      3、IE条件注释Hack

          <!--[if IE]>此处内容只有IE可见<![endif]-->    <!--[if IE 6]>此处内容只有IE6.0可见<![endif]-->    <!--[if IE 7]>此处内容只有IE7.0可见<![endif]-->   <!--[if gt IE 6]> IE6以上版本可识别,IE6无法识别 <![endif]-->    <!--[if gte IE 7]> IE7以及IE7以上版本可识别 <![endif]--> <!--[if lt IE 7]> 低于IE7的版本才能识别,IE7无法识别。 <![endif]-->    <!--[if lte IE 7]> IE7以及IE7以下版本可识别<![endif]-->   <!--[if !IE]>此处内容只有非IE可见<![endif]-->

 

          

     

ie6常见css解析bug及hack

IE6常见CSS解析Bug及hack######1)图片间隙描述:在div,dl,li中插入图片时,图片会将盒子下方撑大3px~5px(设置高度后依旧被撑大)???hack1:将</div>与<img/>写在一行上(针对div);???hack2:将<img/>转为块状元素,添加声明:display:block;(... 查看详情

css兼容解决之hack

...于不同的浏览器,甚至同一浏览器的不同版本对CSS的解析认识不一样,导致生成的页面效果不一致,写出针对不同浏览器CSScode就称为CSShack。常用的CSShack有三种方式,CSS内部hack、选择器hack、HTML头部引用,其中第一种最常用。CSS... 查看详情

什么叫做hack

...如InternetExplorer6,InternetExplorer7,MozillaFirefox等,对CSS的解析认识不一样,因此会导致生成的页面效果不一样,得不到我们所需要的页面效果。这个时候我们就需要针对不同的浏览器去写不同的CSS,让它能够同时兼容不同的浏览器,... 查看详情

什么是hack技术?

...如InternetExplorer6,InternetExplorer7,MozillaFirefox等,对CSS的解析认识不一样,因此会导致生成的页面效果不一样,得不到我们所需要的页面效果。 这个时候我们就需要针对不同的浏览器去写不同的CSS,让它能够同时兼容不同的浏览... 查看详情

csshack技术介绍及常用的hack技巧(代码片段)

...不同的浏览器写不同的CSS代码的过程,就叫CSSHack。CSSHack常见的有三种形式CSS属性Hack、CSS选择符Hack以及IE条件注释Hack(Hack主要针对IE浏览器)1、属性级Hack:比如IE6能识别下划线”_” 查看详情

csshack

...于不同的浏览器,甚至同一浏览器的不同版本对CSS的解析认识不一样,导致生成的页面效果不一致,写出针对不同浏览器CSScode就称为CSShack。常用的CSShack有三种方式,CSS内部hack、选择器hack、HTML头部引用,其中第一种最常用。CSS... 查看详情

常用的csshack

...不同的浏览器写不同的CSS代码的过程,就叫CSSHack。CSSHack常见的有三种形式:CSS属性Hack、CSS选择符Hack以及IE条件注释Hack,Hack主要针对IE浏览器。1、属性级Hack:比如IE6能识别下划线”” 查看详情

可接受的 CSS hacks/修复

...只提供给IE,并且你记得它就在那里。使用子选择器的最常见的技巧是不安全,因为IE7支持它们。使用height:1%只是感觉很脏(但那可能只是我)。我知道ie7-js,所以IE6的 查看详情

经常使用的csshack技术集锦

...不同的浏览器写不同的CSS代码的过程。就叫CSSHack。CSSHack常见的有三种形式:CSS属性Hack、CSS选择符Hack以及IE条件凝视Hack。Hack 查看详情

前端常见框架及组件的大体认识(代码片段)

前端的知识体系做前端,不只是html+css+javascript,你必须知道更多。一、框架1.vue简介vue于2014年2月由Google前员工尤雨溪发布。在国内,vue有着得天独厚的优势,因为它的作者是华人尤雨溪,技术文档相对... 查看详情

css中!important作用

...同样显示效果的话,那么只有对有差异的浏览器写它自己认识而别的浏览器不认识的样式来达到显示相同的目的,这个在css中叫hack。所以我们就需要知道某个浏览器认识某些写法了。当遇到问题的时候就可以使用这些hack来解决... 查看详情

css.hack

1.有破坏倾向的(黑客);2.对有破坏倾向的进行抓捕的(红客);3.浏览器的兼容性问题,Trident(IE内核);4.Gecko(Firefox内核):Gecko的特点是代码公开;5.Trident实际上是一款开源的内核。6.IE浏览器从IE6开始就有双内核了(Trident+Webkit);  查看详情

css中的hack

1、什么是CSShack?CSShack是通过在CSS样式中加入一些特殊的符号,让不同的浏览器识别不同的符号(什么样的浏览器识别什么样的符号是有标准的,CSShack就是让你记住这个标准),以达到应用不同的CSS样式的目的,比如.kwstu{width:300... 查看详情

hack(浏览器兼容csshack)

1.hack的原理由于不同的浏览器对CSS的支持及解析结果不一样,还由于CSS中的优先级的关系。我们就可以根据这个来针对不同的浏览器来写不同的CSS。CSSHack大致有3种表现形式,CSS类内部Hack、选择器Hack以及HTML头部引用(ifIE)Hack,CSS... 查看详情

css-hack

针对不同的浏览器写不同CSS样式的过程,就叫hack<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>Document</title><style>.box{width:100px;height:100px;background:red;b 查看详情

css:hack方式一览

...http://blog.csdn.net/freshlover/article/details/12132801 什么是CSShack由于不同厂商的流览器或某浏览器的不同版本(如IE6-IE11,Firefox/Safari/Opera/Chrome等),对CSS的支持、解析不一样,导致在不同浏览器的环境中呈现出不一致的页面展现效果... 查看详情

css-hack

cssHack是为了解决不同浏览器显示不同从而是css代码兼容不同的浏览器 “-″减号是IE6专有的hack “9″IE6/IE7/IE8/IE9/IE10都生效 “ 查看详情

关于css的hack问题

<!--[if<keywords>?IE<version>?]>HTML代码块<![endif]-->取值:<keywords>if条件共包含6种选择方式:是否、大于、大于或等于、小于、小于或等于、非指定版本是否:指定是否IE或IE某个版本。关键字:空大于:选择大于... 查看详情