IE | 新视界 (New Vision)

Posts Tagged ‘IE’

在IE6里准确显示较小高度的DIV层

Date: 2009.03.23 | Category: Web Front-end | Response: 1

在做网页设计的时候，尤其是给咱们国内做网站，一定要考虑到兼容性的问题。Firefox、Chrome、Safari、IE8这类对于CSS标准支持的比较好的网站，基本上测试一种就差不多行了（一些Javascript除外）。但是对于IE6、IE7这两个浏览器，要区别对待。特别是IE6，支持CSS一点都不好，自己说了算，但是在国内却有数量庞大的电脑依然在使用IE6浏览器。我想这与安装了盗版XP并禁用了自动更新功能有关吧。

转到今天的主要话题。在给一个朋友做网站的时候，发现有个小问题。在我定义的一个div层中，只有一条横线，高度为4px。在IE8、Firefox、Chrome中均显示正确，但是在IE6中却显示出了三条线，而这个div的高度也增加为15px。于是我将高度设成10px，依然不见效，但是设置成30px的时候，高度就增加出来了。这说明这个div盒子里面并不是空的，尽管我在<div></div>中间连一个空格也没有。

没错，这就是字体虚占位了。IE6默认按照字体大小min-height了一下这个div层，才会出现如此的问题。所以我们将计就计，把字体大小设成0不就好了？再加上一个overflow的hidden，一切就完美了。

建议定义一个css的class来处理这类的问题，我是这么干的：

.miniboxhack{font-size:0; overflow:hidden;}

问题解决了。
技巧:在IE, Safari 上使用Foxmarks 书签同步扩展

Date: 2009.02.06 | Category: Software, Web Front-end | Response: 0

从网上看到的一篇文章，对我很有用，相信很多人也都需要，转贴来，呵呵。

源地址：http://www.cnbeta.com/articles/76382.htm

这下子，我们可以同步IE、Firefox和Safari中的书签了。真正实现了书签“大一统”。不容易啊。

Foxmarks 原本是Firefox 上的书签同步扩展, 它可以将你的书签以及密码全部同步到服务器上, 就算重装或是换了电脑都不必担心书签遗失和密码忘记的问题.
来自Lifehacker的消息称, Foxmarks 已经开始支援其他浏览器IE, Safari. 这样就算换了电脑浏览器不是Firefox 也一样能同步到熟悉的书签.

Foxmarks 在IE, Safari 的浏览器上提供了和Firefox 基本相同的功能, 不过目前还是有一些变化的:
首先, 没有密码同步功能. 呃, 不过没有关系, 我们可以找Dropbox 的密码同步功能来解决这个问题.
另外, 你也不能同步到自己的服务器上去. 我们知道在Firefox 里是可以选择同步到自己搭建的服务器上的, 不过对大多数使用者来说, 这个功能还是很少用到的啦.
还有, 就是如果要和iPhone 同步书签的话, 必须使用Mac Safari. 不过当初使用Firefox 也不能同步啦, 所以这可以算是个新添的吧.
如果你想用Foxmarks 对IE, Safari 进行书签同步, 你可以到官网下载Foxmarks for IE, Safari(猛击这里下崽儿).
或请直接猛击图标下崽儿:
[转] 译稿:UserAgent的历史变迁

Date: 2008.12.05 | Category: Web Front-end | Response: 0

转载于：http://www.cnbeta.com/articles/71532.htm，写的挺好的。从这篇文章我们也可以看出，Gecko引擎的强大之处，以及Microsoft的IE一些无赖技巧。Business is business，能够生存下来，得到用户的青睐，赚到了钱，才是王道。无赖这个词在商业上并不是贬义词。

Google推出的Chrome让大家热议纷纷，只有专业用户才会注意到用Chrome访问网页时发出的“Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US) AppleWebKit/525.13 (KHTML, like Gecko) Chrome/0.2.149.27 Safari/525.13”UserAgent字符串，貌似天书，它到底是怎么回事儿代表什么呢？我们来看看吧.

最早的时候有一个浏览器叫NCSA Mosaic，把自己标称为NCSA_Mosaic/2.0 (Windows 3.1)，它支持文字显示的同时还支持图片，于是Web开始好玩起来。

然后出现了一个新的网页浏览器，“Mozilla”，其实就是“Mosaic终结者”的意思，这搞的Mosaic很不爽，（毕竟Mosaic出道早，江湖老），新浏览器最后正式公布的名称是Netscape，它把自己标称为Mozilla/1.0 (Win3.1)，更好玩了。Netscape支持框架显示，后来框架在大家中间流行起来了，但Mosaic不支持框架啊，于是伟大的“用户代理人探测”技术出现了，如果是“Mozilla”，那就发给支持框架的页面，至于其他的浏览器，则发给不含框架的页面。

Netscape想逗Microsoft玩儿，把Windows叫做“几乎不曾做过调试的设备驱动器”，后者很恼火。Microsoft于是推出了自己的网页浏览器，叫做Internet Explorer，希望它能成为“Netscape终结者”。Internet Explorer也支持框架，但它不是Mozilla啊，所以没人给它发送带有框架的页面。Microsoft慢慢烦躁起来，不再寄希望于网站管理员逐渐认识IE并给它发框架，而是宣称自己是“兼容Mozilla”的，开始模仿Netscape，把自己标称为Mozilla/1.22 (compatible; MSIE 2.0; Windows 95)，这样Internet Explorer也能收到框架了，整个Microsoft狂喜，但网站管理员开始有点被搞糊涂了。

Microsoft把IE和Windows一起卖，并且把产品也弄得比Netscape更好了，拉开了第一场浏览器之战。结果和大家知道的一样，Netscape被干掉了，Microsoft大胜、大喜。但是后来Netscape以Mozilla的新名称重生了，构造了Gecko，标称其为Mozilla/5.0 (Windows; U; Windows NT 5.0; en-US; rv:1.1) Gecko/20020826，Gecko属于渲染引擎，表现优异。Mozilla开发了Firefox，标称为Mozilla/5.0 (Windows; U; Windows NT 5.1; sv-SE; rv:1.7.5) Gecko/20041108 Firefox/1.0，并且Firefox表现也非常优秀。Gecko扩张迅速，一些浏览器使用了它的代码并标称为Mozilla/5.0 (Macintosh; U; PPC Mac OS X Mach-O; en-US; rv:1.7.2) Gecko/20040825 Camino/0.8.1 ，这是一个，还有Mozilla/5.0 (Windows; U; Windows NT 5.1; de; rv:1.8.1.8) Gecko/20071008 SeaMonkey/1.0，另一个，它们都伪装成Mozilla，同时也都是基于Gecko支持的。

Gecko表现优秀，IE则很差劲，于是身份甄别再次发生，输送给Gecko的是设计良好的网页代码，其他浏览器就没有这个待遇了。Linux的跟随者很伤心，因为他们创建了基于KHTML引擎支持的Konqueror，但却不会被输送好代码，虽然他们自己认为KHTML和Gecko一样优秀，于是Konquerer开始伪装自己“像Gecko”那样以得到好的网页，并标称自己为Mozilla/5.0 (compatible; Konqueror/3.2; FreeBSD) (KHTML, like Gecko)，这个世界更让人困惑了.

后来出现了Opera这样的主儿，宣称“允许用户自己决定让浏览器装成谁”，它的菜单中提供了Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; en) Opera 9.51， Mozilla/5.0 (Windows NT 6.0; U; en; rv:1.8.1) Gecko/20061208 Firefox/2.0.0 Opera 9.51，Opera/9.51 (Windows NT 5.1; U; en) 供大家来选择，选谁是谁。

Apple开发了Safari，使用了KHTML，同时也增加了很多新特性，后来干脆一锅煮，另起炉灶叫了WebKit，但是它有希望能够得到那些为KHTML编写的网页，于是Safari标称自己为Mozilla/5.0 (Macintosh; U; PPC Mac OS X; de-de) AppleWebKit/85.7 (KHTML, like Gecko) Safari/85.5，这个世界更混乱了。

Microsoft越来越担心Firefox的发展，重新启动了Internet Explorer的开发，标称自己为Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.0) ，可以很好的渲染代码，但那要看网站管理员是否指示它这么做。

Google也开发了自己的浏览器Chrome，使用了Webkit，有点像Safari，希望能得到为Safari编写的网页，于是决定装成Safari。这样啊，Chrome使用了WebKit渲染引擎，想装成Safari，而WebKit呢又伪装自己是KHTML，KHTML呢又是伪装成Gecko的，同时所有的浏览器又都宣称自己是 Mozilla，于是，Chrome宣称自己是Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US) AppleWebKit/525.13 (KHTML, like Gecko) Chrome/0.2.149.27 Safari/525.13,，UserAgent字符串彻底混乱了，也几乎不再发挥任何作用，每个人都宣称自己是别人，混乱充斥人间啊。
解决IE6、IE7在CSS中设置最小高度遇到的问题

Date: 2008.07.07 | Category: Web Front-end | Response: 0

在开发一个某公司的网页界面时，遇到了这样的问题：当设置某一个区域的最小高度为某个值的时候，在Firefox、IE6以及IE7中的表现并不一样。如果只是设定了min-height值，那么在IE6中不能识别；但设定了height值，在IE7和Firefox中，位置就会固定了。这是一个很大的问题。那么为了协调各个浏览器和各个版本，我们怎样做才能解决最小高度的问题呢？

我在网络上寻找了一些相关资料，有一种解决方法比较好：

.distance {
height:auto!important;
height:100px;
min-height:100px;
}

!import（优先）标签在IE6中并不认识，所以在IE6中上述代码会被理解成为：

height:100px;
min-height:100px;

而在IE7中则是：

height:auto;
min-height:100px;

在这里，我们所利用的特性是：
- IE6不能识别 !important 标签;
- IE6不能识别 min-height 标签;
- IE6中的高度(height)标签的最终效果等同于IE7与Firefox浏览器中的最小高度(min-height)标签;
最终便可以解决上述问题。