CSS hacks take advantage of browser bugs for hiding CssRules from specific web browsers. Listed below are the hacks for major browsers like ie6, ie7, firefox2, firefox3, Google chrome, safari and opera.
Inline Hack for IE
* (star) can be used as the inline hack for both ie6 and ie7.
For Example:
Syntax: .selector{*property:value;}
.logo{*margin-left:10px;}
IE6 browser inline Hack
_ (underscore) can be using only for ie6
For Example:
Syntax: .selector{_property:value;}
.logo{_margin-left:10px;}
Firefox inline style
content:"\"/*" can be used for firefox only where IE cannot recognize it.
Internal Style
Use * html for ie6 and *+html hack for ie7
For Example:
Synatax: * html .selector{property:value;} , * + html .selector{property:value;}
* html .logo{margin-left:10px;} for ie6
* + html .logo{margin-left:20px;} for ie7
IE7 and Firefox browser Hack
Use html>body hack for ie7 and firefox.
For Example:
Syntax: html>body .selector{property:value;}
html>body .logo{margin-left:10px} will take only in ie7 and firefox
Mordern browser Hack or Firefox Hack
Use html>/**/body {} hack which will support only in both firefox2 and firefox3.
For Example:
Syntax: html>/**/body .selector{property:value;}
html>/**/body .logo{margin-left:10px} will take only in firefox.
Browser hack for Opera versions 9 and below
Use html:first-child {} for opera browser. Also you use
Syntax: @media all and (min-width:0px) {head~body .selector {property:value;}}
For Example:
@media all and (min-width:0px) {head~body .logo {margin-left:10px;}} only for opera
Firefox3 browser hack
Use html>/**/body .selector, x:-moz-any-link, x:default {property:value;} for firfox3 only.
For Example:
Syntax: html>/**/body .pro_yl, x:-moz-any-link, x:default {background:red;}
Google Chrome browser hack
Use body:nth-of-type(1) .elementOrClassName{property:value;} only for google chrome.
For Example:
body:nth-of-type(1) .logo{margin:20px;}
@media screen and (-webkit-min-device-pixel-ratio:0)
{ #div { properties:value; } }
Safari browser hack
Use Syntax: body:first-of-type .elementOrClassName{property:value;}
Fox Example:
body:first-of-type .logo{margin-top:10px;} only for safari.
Hope this information will be useful for you. Please use the browser hacks in a proper manner. For example, you might know double margin bug in ie6. In such case you can use display inline which will render correctly by all the browsers instead of you using ie6 hack seperately.
分享到:
相关推荐
在`browser-hack-sass-mixins`项目中,开发者已经预先定义了一系列针对不同浏览器的hack,如Internet Explorer(IE)、Google Chrome、Firefox、Microsoft Edge和Opera。 1. **Internet Explorer(IE)Hacks**: -...
"Vim-101-hacks"可能涵盖了基本操作到高级技巧,包括快速启动、导航、插入模式、命令模式、可视模式的切换,以及宏录制与回放、插件使用、自动完成、语法高亮等。学习Vim的快捷键和工作流程能极大提高文本编辑效率。...
- **IE8, Firefox, Safari, Opera (除了IE6,7)** ```css html > /**/ body #cuatro { color: red; } ``` - **Opera 9.27及以下, Safari 2** ```css html :first-child #cinco { color: red; } ``` - **Safari ...
《无线黑客:100个工业级技巧与工具》是一本深入探讨无线技术领域的专著,旨在为读者提供实用的技巧和工具,帮助他们在无线网络安全、优化和创新方面取得突破。这本书涵盖了广泛的无线技术主题,包括Wi-Fi、蓝牙、...
书是Miracle Linux的创始人吉冈弘隆和几位工程师们多年从事内核开发的经验积累。从调试器的基本使用方法、汇编的基础知识开始,到内核错误信息捕捉、应用程序调试、内核调试,本书深入浅出地讲解了Linux下应用程序和...
《Wireless Hacks 100 Industrial-Strength Tips and Tools》是一本由Rob Flickenger编写的书籍,出版于2003年9月,由O'Reilly出版社发行,ISBN号为0-596-00559-8,全书共304页。这本书面向中高级无线网络用户,提供...
资源来自pypi官网。 资源全名:Coin-Master-Hacks-Spin-Generator-2021-2.0.2.tar.gz
《Google Hacks - 100 Industrial-Strength Tips & Tools》是O'Reilly在2003年出版的一本技术指南,它揭示了如何高效、深入地利用Google搜索引擎进行信息检索和数据分析。这本书包含了100个实用技巧和工具,旨在帮助...
标题 "Python库 | free-cash-app-money-hacks-no-offers-2022-v-6907.zip" 暗示我们正在处理一个与Python相关的库,可能是一个用于自动化或优化某款名为 "Cash App" 的应用的工具。描述进一步确认了这是一个Python库...
另外,现代浏览器已经大大减少了对CSS hacks的依赖,因为现代浏览器如Chrome、Firefox、Safari和Edge等,都基于Web标准进行开发,对CSS的支持也在不断加强。因此,对于现代网页设计来说,更建议使用CSS前缀、特性...
### CSS Hacks与Filter详解 #### 一、CSS Hacks简介 在Web开发领域,不同浏览器对于CSS的支持程度和解析方式存在差异。由于CSS标准本身并没有提供一种直接的方法来指定某个特定版本的浏览器,这就导致了跨浏览器...
Sed和Awk是UNIX和Linux系统中极为重要的流编辑器和文本处理工具,它们能够通过简单的命令或脚本高效处理文本文件,实现复杂的文本转换和报告生成。接下来,我们将根据提供的文件内容详细地说明Sed和Awk的关键知识点...
Knight Hacks CSS研讨会对于研讨会,我们将使用starter目录中的代码。 在您最喜欢HTML / CSS IDE(建议使用Visual Studio Code)中打开此文件,然后在浏览器(建议使用Chrome)中打开index.html 。 最终产品位于...
在网页开发过程中,兼容性问题始终是一个不可忽视的挑战,特别是在面对不同的浏览器,如Internet Explorer(IE)和Firefox时。本文将深入探讨IE5至IE9以及Firefox的兼容性问题,解析解决这些问题的方法,以及如何...
all css hacks 列表 支持目前主流游览器
总之,"CSS Conditionals & Hacks Cheat Sheet"是Web开发者必备的参考资料,它能帮助他们有效地处理跨浏览器兼容性问题,确保网站在不同环境下都能正常显示。通过学习和运用其中的知识,开发者可以提高工作效率,为...
利用这些CSS Hacks,你能够更好的针对IE、Chrome、Firefox、Opera和Safari,代码如下: 浏览器特定的CSS Hacks综合列表: 复制代码代码如下:/***** Selector Hacks ******//* IE6 and below */* ...