欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

我有一段css pading margin 在火狐中不兼容_html/css_WEB-ITnose

程序员文章站 2022-04-11 16:17:50
...
.test {   	margin-top: -69px; /*for Chrome*/	margin-top: -64px\9; /*for ie*/          margin-top: -67px\9; /*请问FF safari 的应该怎么写呢*/ 	padding:8px;         如果margin 这个 用FF的hack 实现不了 那么就加在padding上        FF? padding:10px;  /*请问FF safari 的应该怎么写呢*/         } 



谢谢


回复讨论(解决方案)

-webkit-margin-top试试

http://leeiio.me/css-hack-for-firefox-opera-safari-ie/

-webkit-margin-top试试

-webkit-margin-top:-67px;

不行啊

可以注意hack的书写顺序
#tip {
background: blue; /*Firefox 背景变蓝色*/
background: red \9; /*IE8 背景变红色*/
*background: black; /*IE7 背景变黑色*/
_background: orange; /*IE6 背景变橘色*/
}



或者

firefox 的 CSS hack 写法
第一个使用了 body:empty 来区分 Firefox 1 和 2 。第二个 hack使用了全部 Firefox 浏览器的专有扩展 -moz。 -moz- 只对 Firefox有效,使用这个 Hack 大可不必担心其他浏览器的影响。

/* css document Firefox 1、Firefox 2 css hack */
body:empty .tl{ color:#f90;}
/* css document Firefox css hack */
@-moz-document url-prefix(){
.tl{ color:#f90;}
}
Opera 的 CSS hack 写法
/* css document Opera css hack */
@media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0){
.tl{ color:#f90;}
}
chrome、safari 等 webkit内核浏览器 的 CSS hack 写法
/* css document chrome、safari css hack */
@media screen and (-webkit-min-device-pixel-ratio:0){
.tl{ color:#f90;}
}