css hack 大全

各个浏览器的css hack区别属性:

IE6:       _zoom:1;

IE6/7:     *zoom:1;

IE6/7/8/9 :\9

各个浏览器的css hack区别规则

IE6:   *html{}

IE7:   +.class{}

非IE6: html>body {}

仅火狐:@-moz-document url-prefix(){}

saf3+和谷歌:@media all and (-webkit-min-device-pixel-ratio:0){}

仅opera:@media all and (-webkit-min-device-pixel-ratio:10000),not all and(-webkit-min-device-pixel-ratio:0){}

iphone/mobile/webkit:@media screen and (max-device-width:480px){}

但是,我们应该尽量避免使用CSS Hack

  1. property:value; /* 所有浏览器 */
  2. +property:value; /* IE7 */
  3. _property:value; /* IE6 */
  4. *property:value; /* IE6/7 */
  5. property:value\9; /* IE6/7/8/9,即所有IE浏览器 */
  1. * html selector { }; /* IE6 */
  2. *:first-child+html selector { }; /* IE7 */
  3. html>body selector { }; /* 非IE6 */
  4. @-moz-document url-prefix() { }; /* firefox */
  5. @media all and (-webkit-min-device-pixel-ratio:0) { }; /* saf3+/chrome1+ */
  6. @media all and (-webkit-min-device-pixel-ratio:10000),not all and (-webkit-min-device-pixel-ratio:0) { }; /* opera */
  7. @media screen and (max-device-width: 480px) { }; /* iPhone/mobile webkit */
posted @ 2015-09-01 14:03  Skylor.min  阅读(508)  评论(0编辑  收藏  举报