本文将介绍兼容IE+、FF、Chrome、Safari、Opera的技巧

一、CSS HACK

专门为某版本的浏览器设置样式,从而解决浏览器显示的差异

selector { +property:value; } 在属性名前加上加号"+",这个Hack只有IE系列可以识别.
selector { *property:value; } 在属性名前加上星号"*",这个Hack只有IE系列可以识别.
selector { _property:value; } 在属性名前加上下划线"_",这个Hack只有IE系列 (除IE7外) 识别.
* html selector{ property:value; } 在选择器上运用继承法 * html selector, 这个Hack只有IE系列 (除IE7外) 可以识别.
html/**/ >body selector { property:value; } 在选择器上运用继承法 html/**/ >body selector ,这个Hack只有IE系列 (除IE7外) 可以识别.
selector { property/**/:value; } 在属性名和冒号":"之间加入注释,屏蔽IE6用.
selector/**/ { property/**/:value; } 在选择器和花括号"{"之间以及在属性名和冒号":"之间加入注释,屏蔽IE5和IE6用 (不屏蔽IE5.5) .
select/**/ { property:value; } 在选择器和花括号"{"之间加入注释,屏蔽IE5用.
*+html selector { property:value !important; } 在选择器上运用继承法 *+html selector 再加上 !important, 这个Hack只有IE7可以识别.

Firefox:

*:lang(lang) selector { property:value !important; } 用伪类lang(语言)再加上!important进行定义的话,目前只有Firefox可以识别.

Opera:

@media all and (min-width: 0px){ selector { property:value; } } 利用特殊继承法进行定义的话,目前只有Opera可以识别.

CSS跨浏览器(转)的更多相关文章

  1. css跨浏览器大全

    CSS技巧1.div的垂直居中问题 vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然后插入文字,就垂直居中了.缺点是要控制内容不要 ...

  2. 跨浏览器开发:CSS

    理解CSS盒子模型 如果不需要很多奇巧淫技的跨浏览器兼容的 CSS 代码,透彻地理解 CSS 盒子模型是首要事情,CSS 盒子模型并不难,且基本支持所有浏览器,除了某些特定条件下的 IE 浏览器.CS ...

  3. 学习animate.css包含了一组炫酷、有趣、跨浏览器的动画

    1.animate.css包含了一组炫酷.有趣.跨浏览器的动画,可以在你的项目中直接使用. 第一步:引入animate.css样式文件或者引入某些平台的CDN文件: <head> < ...

  4. LESS是一个CSS预处理器,跨浏览器友好,提供诸如变量,函数, mixins 和操作等功能,可以构建动态CSS

    什么是LESS? LESS是一个CSS预处理器,可以为网站启用可自定义,可管理和可重用的样式表. LESS是一种动态样式表语言,扩展了CSS的功能. LESS也是跨浏览器友好. CSS预处理器是一种脚 ...

  5. 转载于山边小溪的博客--编写跨浏览器兼容的 CSS 代码的金科玉律

    http://www.cnblogs.com/lhb25/archive/2010/06/19/1760786.html   原始网页 作为 Web 设计师,你的网站在各种浏览器中有完全一样的表现是很 ...

  6. 实现跨浏览器html5表单验证

    div:nth-of-type(odd){ float: left; clear: left; } .origin-effect > div:nth-of-type(even){ float: ...

  7. 使用ZeroClipboard解决跨浏览器复制到剪贴板的问题

    Zero Clipboard的实现原理Zero Clipboard 利用透明的Flash让其漂浮在复制按钮之上,这样其实点击的不是按钮而是 Flash ,这样将需要的内容传入Flash,再通过Flas ...

  8. ZeroClipboard / jquery.zclip.min.js跨浏览器复制插件使用中遇到的问题解决

    之前写过一个淘宝优惠券连接PC端转手机端连接的小工具,当时写到将转换好的url复制到剪切板这块时解决了IE和火狐,就是没办法搞定Chrome,知道可以通过flash搞定,但是觉得太麻烦没有仔细研究. ...

  9. HTML 5 video 标签跨浏览器兼容

    <video width="320" height="240" controls>   <source src="movie.mp4 ...

随机推荐

  1. Cadence PCB层的概念

    Slikscreen_Top  :顶层丝印层 Assemly_Top    :装配层,就是元器件含铜部分的实际大小,用来产生元器件的装配图.我自己感觉这一层如果对于贴片的元器件,如电容,就是两个贴片铜 ...

  2. Margin的垂直外边距问题

    做练习的时候遇到一个margin的问题,代码结构如下,给父元素body中的子元素div设置了margin:50px auto;本来我是想让子元素div距离父元素上边拉开50个像素,结果却是子元素div ...

  3. Microsoft JScript 运行时错误: Sys.WebForms.PageRequestManagerParserErrorException无法分析从服务器收到的消息。之所以出现此错误,

    Microsoft JScript 运行时错误: Sys.WebForms.PageRequestManagerParserErrorException: 无法分析从服务器收到的消息.之所以出现此错误 ...

  4. PHP实现http与https转化

    http://zyan.cc/post/142/ 最近在写PHP程序时,需要使浏览器在https和http之间转化,上网搜索相关信息,无奈只有最近在写PHP程序时,需要使浏览器在https和http之 ...

  5. ###学习《C++ Primer》- 2

    点击查看Evernote原文. #@author: gr #@date: 2014-10-01 #@email: forgerui@gmail.com Part 2: STL顺序容器(第9章) 一.标 ...

  6. 12天学好C语言——记录我的C语言学习之路(Day 5)

    12天学好C语言--记录我的C语言学习之路 Day 5: 第五天的学习开始了,今天我们主要对几个程序进行编写,让自己充分的熟练编程语言,大量的题目会让自己变的精炼.以一个程序(program 5.1) ...

  7. 关于char 指针变量char *=p;这个语句的输出问题

    学习指针的时候我一直有个疑惑,请看下面的代码: #include <iostream> using std::cout; void main() { ; int *nPtr=&nu ...

  8. 洛谷 P1108 低价购买

    P1108 低价购买 标签 动态规划 难度 提高+/省选- 题目描述 "低价购买"这条建议是在奶牛股票市场取得成功的一半规则.要想被认为是伟大的投资者,你必须遵循以下的问题建议:& ...

  9. How to: Reading an ini config file from a batch file

    Original Link: http://almanachackers.com/blog/2009/12/31/reading-an-ini-config-file-from-a-batch-fil ...

  10. [技术翻译]构建现代化的 Objective-C (上)

    我的技术博客经常被流氓网站恶意爬取转载.请移步原文:http://www.cnblogs.com/hamhog/p/3561514.html,享受整齐的排版.有效的链接.正确的代码缩进.更好的阅读体验 ...