请选择 进入手机版 | 继续访问电脑版
贠老师培训群:150322713    贠老师QQ:767708506

贠老师office培训-excel学习网

 找回密码
 立即注册
点击咨询贠老师
查看: 184|回复: 4

Firefox与IE浏览器在CSS样式表中的差异

[复制链接]

607

主题

604

帖子

1909

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
1909
发表于 2016-1-20 22:58:07 | 显示全部楼层 |阅读模式

1 针对firefox ie6 ie7的css样式

现在大部分都是用!important来hack,对于ie6和firefox测试可以正常显示,但是ie7对!important可以正确解释,会导致页面没按要求显示!找到一个针对IE7不错的hack方式就是使用“*+html”,现在用IE7浏览一下,应该没有问题了。

现在写一个CSS可以这样:

#1 { color: #333; } /* Moz */
* html #1 { color: #666; } /* IE6 */
*+html #1 { color: #999; } /* IE7 */

那么在firefox下字体颜色显示为#333,IE6下字体颜色显示为#666,IE7下字体颜色显示为#999。

2 css布局中的居中问题

主要的样式定义如下:

body {TEXT-ALIGN: center;}
#center { MARGIN-RIGHT: auto; MARGIN-LEFT: auto; }

说明:

首先在父级元素定义TEXT-ALIGN: center;这个的意思就是在父级元素内的内容居中;对于IE这样设定就已经可以了。

但在mozilla中不能居中。解决办法就是在子元素定义时候设定时再加上“MARGIN-RIGHT: auto;MARGIN-LEFT: auto; ”

需要说明的是,如果你想用这个方法使整个页面要居中,建议不要套在一个DIV里,你可以依次拆出多个div,只要在每个拆出的div里定义MARGIN-RIGHT: auto;MARGIN-LEFT: auto; 就可以了。

3 盒模型不同解释.

#box{
  width:600px;
     //for  ie6.0-  width:500px;
    //for ff+ie6.0
}
#box{
  width:600px!important
       //for ff
   width:600px;
     //for ff+ie6.0
   width /**/:500px;
    //for  ie6.0-
}
回复

使用道具 举报

5

主题

543

帖子

73

积分

注册会员

Rank: 2

积分
73
发表于 2017-11-3 14:21:23 | 显示全部楼层
学习贵在坚持哦
回复 支持 反对

使用道具 举报

2

主题

1002

帖子

108

积分

注册会员

Rank: 2

积分
108
发表于 2018-3-30 16:52:58 | 显示全部楼层
顶顶
回复 支持 反对

使用道具 举报

2

主题

1092

帖子

156

积分

注册会员

Rank: 2

积分
156
发表于 2018-10-22 12:28:05 | 显示全部楼层
顶一个
回复 支持 反对

使用道具 举报

0

主题

700

帖子

102

积分

注册会员

Rank: 2

积分
102
发表于 2018-12-23 20:33:40 | 显示全部楼层
还有许多问题不明白,有点恼火啊!
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则



陕ICP备15003731号  

贠老师培训 GMT+8, 2019-1-20 02:32 , Processed in 0.238907 second(s), 33 queries .

快速回复 返回顶部 返回列表