OurJS


OurJS-我们的JS, 我们的技术-IT文摘; 专注JS相关领域;
我们热爱编程, 我们热爱技术;我们是高大上, 有品味的码农;

欢迎您订阅我们的技术周刊


我们会向您分享我们精心收集整理的,最新的行业资讯,技术动态,外文翻译,热点文章;
我们使用第三方邮件列表向您推送,我们不保存您的任何个人资料,注重您的隐私,您可以随时退订,

欢迎分享您的观点,经验,技巧,心得

让我们一起找寻程序员的快乐,探索技术, 发现IT人生的乐趣;


本网站使用缓存技术每次加载仅需很小流量, 可在手机中流畅浏览;
如果您发现任何BUG,请即时告知我们: ourjs(at)ourjs.com

针对特定浏览器起作用的CSS: IE Chrome Firefox CSS Hack


分享到
分类 编程技巧   关键字 前端   发布 kris  1412329455202
注意 转载须保留原文链接,译文链接,作者译者等信息。  

Firefox的CSS Hack


只在Firefox上应用的CSS Hack,虽然这种情况非常少,但有时也会碰到:

@-moz-document url-prefix() { 
  .cssSelector {
     font-size: 14px;
  }
}

Chrome的CSS Hack


只在Chrome上应用的CSS Hack,目前这种情况还没有碰到(使用Chrome作为开发浏览器的原因?),有备无患吧。

@media screen and (-webkit-min-device-pixel-ratio:0) {
    #test1{color:red;}
}

IE6/7/8/9+的CSS Hack

只在IE上应用的CSS Hack,  这种情况几乎经常碰到, 这里使用的是一种通用的方法,情况复杂,需要先划分一下版本:

在body上附加一个IE版本的class

Hack CSS跟其他CSS文件写一起。

IE9+ 不加Hack;IE6, IE7, IE8 加 ie的前辍,  IE6多加一个ie6的前辍Hack (大部分给ie7/8写的hack, IE6都会用到)

<!--[if lt IE 7 ]><body class="ie ie6"><![endif]-->
<!--[if IE 7]><body class="ie"><![endif]-->
<!--[if IE 8]><body class="ie"><![endif]-->

为IE附加新的CSS文件

IE7/8多加一个,IE6多加两个,就让IE多装点东西吧,不要污染别的CSS文件

<!--[if lt IE 9]>
<link type="text/css" rel="stylesheet" href="css/show_ie.css">
<![endif]-->
<!--[if lt IE 7]>
<link type="text/css" rel="stylesheet" href="css/show_ie6.css">
<![endif]-->


注* lt 是 less than的意思;即 "if less than IE 9" = "if lt IE 9",还有几个,不过用得比较少

  • gt: greater than
  • lte: less than or equal to

社区评论 ( Beta版 )
OnceDoc 您自己的企业内容管理系统——文档、流程、知识库、报表、网盘All In One

访问404页面,寻找丢失儿童
 热门文章 - 分享最多
  1. Bootstrap vs Foundation如何选择靠谱前端框架
  2. Node.JS超越jQuery成为Github上第二受欢迎的开源项目
  3. Docker究竟是什么,为什么这么流行,它的优点和缺陷有哪些?
  4. NodeBots-JavaScript在智能设备驱动(物联网)中的崛起
  5. JavaScript有可能取代AppleScript成为OS X平台的默认编程脚本
  6. 5个经典的前端面试问题
  7. 响应式设计在图片上的应用: 一个HTML元素如何让Web更快
  8. CSS垂直水平完全居中手册
  9. 今天我去面试, 受打击了:你是学 .net 的吧?
  10. Animate.css让添加CSS动画像喝水一样容易
  11. AirJD-简单好用的免费建站工具

 相关阅读 - 编程技巧
  1. 创造canvas的艺术
  2. 有可能将CSS应用到一个字符的一半吗?
  3. Express.JS指南
  4. 在JavaScript中判断整型的N种方法
  5. 你应该使用HTML5的header和footer标签吗?
  6. 功夫:HTML和CSS?
  7. Linux命令及Linux终端的20个趣事
  8. 在NodeJS中启用ECMAScript 6
  9. 如何提高NODE.js中SSL服务的性能
  10. 极快的node.js:来自领英(LinkedIn)移动的10个性能技巧

 关键字 - 前端
  1. 超简易——Bootstrap可关闭tab标签页
  2. 我被问得最多的十个JavaScript前端面试问题
  3. CSS3实现的响应式字体:自适应视图窗口大小的新单位
  4. 15个最好的HTML5前端响应式框架(2014)
  5. 5个经典的前端面试问题
  6. 用css禁用input、checkbox、select等html控件,实现disable效果
  7. 用纯css改变下拉列表select框的默认样式
  8. 我们抛弃了AngularJS:单页面应用的5大缺陷
  9. Animate.css让添加CSS动画像喝水一样容易
  10. 用纯CSS停止冒泡和阻止浏览器默认行为及事件响应,达到禁用(disable)的目的

 欢迎订阅 - 技术周刊

我们热爱编程, 我们热爱技术; 我们是高端, 大气, 上档次, 有品味, 时刻需要和国际接轨的码农; 欢迎您订阅我们的技术周刊; 您只需要在右上角输入您的邮箱即可; 我们注重您的隐私,您可以随时退订.
加入我们吧! 让我们一起找寻码农的快乐,探索技术, 发现IT人生的乐趣;


 关注我们

我们的微信公众号: ourjs-com
打开微信扫一扫即可关注我们:
IT文摘-程序员(码农)技术周刊

ourjs官方微信号