今天接了个新项目,年底要做完。预祝我顺利完成工作吧。在搭CSS框架的过程中,遇到了一些浏览器兼容性问题。于是就统计一下各个浏览器专用的css hack吧。

  (粘贴自百科百科)

  1. 针对火狐浏览器的CSS Hack:

    @-moz-document url-prefix() {    .selector {        attribute: value;    }}

  2. 针对webkit内核及Opera浏览器的CSS Hack:

    @media all and (min-width:0){    .selector {        attribute: value;/*for webkit and opera*/    }}

  3. 从这个样式我们只能把webkit内核的浏览器和Opera浏览器从其它浏览器中区分出来,但并不能区分它们俩,因此我们还需要在上面样式的基础上再加一个样式:

    @media screen and (-webkit-min-device-pixel-ratio:0) {    .selector {        attribute: valueForWebKit;/*only for webkit*/    }}

  4. 由于这个样式是针对webkit的,会把前面的样式覆盖掉,因此,通过这两个样式就能区分出webkit和opera了,opera的属性值取value,webkit的属性值取valueForWebKit。
  5. 其实按常规来说,我们一般是处理ie上的兼容问题,但遇到需要处理火狐或Chrome的兼容问题时,一定要先查看网页结构是否合理以及便签使用是否规范,直到迫不得已时再使用上面的CSS Hack。

不同浏览器下的CSS HACK的更多相关文章

  1. 浏览器的兼容性(CSS浏览器兼容性、CSS hack)

    一.关于CSS hack(尽量不用或者少用,减少页面复杂度) 1.条件注释法:(我的测试是IE9及其以下才有效) 这种方式是IE浏览器专有的Hack方式,微软官方推荐使用的hack方式.举例如下 只在 ...

  2. 浏览器兼容性的css hack 写法

    IE各版本浏览器之间的识别概括如下: IE6:能识别 * .\9 和 _ ,不能识别 !important IE7:能识别 * .\9 和 !important,不能识别 _ IE8:能识别 \9 和 ...

  3. 浏览器兼容的css hack

    <style> div{ background:green; /* for firefox */ *background:red; /* for IE6 */ } </style&g ...

  4. IE7浏览器下CSS属性选择器二三事

    一.为何专门说起IE7 以前,或者说数年前,我们从事桌面端网页开发的时候,基本上都还要兼顾IE6浏览器, 即使有些特性,IE7支持,我们也会忽略之.于是,我们会不自然地把IE6和IE7浏览器归为一路货 ...

  5. [转]CSS hack大全&详解

    转自:CSS hack大全&详解 1.什么是CSS hack? CSS hack是通过在CSS样式中加入一些特殊的符号,让不同的浏览器识别不同的符号(什么样的浏览器识别什么样的符号是有标准的, ...

  6. CSS hack方式一览【转】

    做前端多年,虽然不是经常需要hack,但是我们经常会遇到各浏览器表现不一致的情况.基于此,某些情况我们会极不情愿的使用这个不太友好的方式来达到大家要求的页面表现.我个人是不太推荐使用hack的,要知道 ...

  7. Web前端技术研究:Css hack技术---令人沮丧的技术

    我最近想好好整理下csshack技术,但是结果很沮丧,下面我将我最初写的笔记和大家分享下. 我在单位整理的研究笔记: 不同的浏览器对某些CSS代码解析会存在一定的差异,因此就会导致不同浏览器下给用户展 ...

  8. css样式 --- CSS hack

    前端样式,虽然不是经常需要hack,但是我们经常会遇到各浏览器表现不一致的情况.基于此,某些情况我们会极不情愿的使用这个不太友好的方式来达到大家要求的页面表现.我个人是不太推荐使用hack的,要知道一 ...

  9. 史上最全的CSS hack方式一览

    做前端多年,虽然不是经常需要hack,但是我们经常会遇到各浏览器表现不一致的情况.基于此,某些情况我们会极不情愿的使用这个不太友好的方式来达到大家要求的页面表现.我个人是不太推荐使用hack的,要知道 ...

随机推荐

  1. 【转】开始使用Mac OS X——写给Mac新人

    写这篇文档的原因有两个,一.身边使用Mac的朋友越来越多,经常会有人来咨询一些常见的使用问题,比如:“为什么把界面右上角的红色按钮叉掉,程序还没有关闭?”之类.而且我也不愿意看到很多人使用OSX时仅仅 ...

  2. hdoj 5494 Card Game

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=5494 题意:首先一个数t代表测试样例组数  然后两个数n,m 代表数列中有n个数  从中取m个数   ...

  3. Android Fragment 多标签应用

    1.使用Fragment 可以方便的替代TabActivity.ViewGroup 2.同时也省去了在AndroidManifest.xml文件中 添加相应的Activity 3.Fragment 是 ...

  4. 微信开发第3章 通过accesstoken获取用户分组

    上一章我们获取到了access_token,那么我们可以试着拿token获取用户粉丝分组,调用接口地址为: http请求方式: GET(请使用https协议) https://api.weixin.q ...

  5. 【转】Android仿QQ截图应用测试

    使用过QQ的同学应该都用过QQ截图,Ctrl+Alt+A进入截图操作,通过拉伸,移动高亮区域的框体可以快速截取我们需要的图片.在android应用中,我们也经常需要截图操作,以下实现了一个类似QQ截图 ...

  6. request对象方法详解

    自己整理的 javax.servlet.http.HttpServletrequest 所有方法,欢迎收藏! 方法名 说明 isUserInRole 判断认证后的用户是否属于某一成员组 getAttr ...

  7. richTextBox设置选中的字体属性

      执行一次设置选中的字体样式 再执行一次恢复正常     //粗体 public void ToggleBold() { if (richTextBox1.SelectionFont == null ...

  8. ArcGIS Engine中如何获取Map中已经选择的要素呢

    1.使用IEnumFeturea对象获取map中的FeatureSelection,该方法可以获取所有图层的选择要素.IMap中的FeatureSelection可不是IFeatureSelectio ...

  9. HDU-4879-ZCC loves march(map+set+并查集)

    Description On a m*m land stationed n troops, numbered from 1 to n. The i-th troop's position can be ...

  10. Android 疑难杂症之获取listView Item上面组件的值

    事实上思路就是又一次findById一次 获取当中组建的值.比方应用场景是 长按点击事件 获取目录名字 @Override public boolean onItemLongClick(Adapter ...