郁闷

郁闷发起的话题

(12 posts)

兼容各浏览器的图片垂直水平居中效果

最近有很多朋友都在问我：“有没有兼容IE和FireFox的图片垂直居中的方法？”。接到问题后我也查阅了网上的相关资料，虽然很多，但总是会出现这样或那样的问题。如：IE和FireFox不兼容，图片大小不确定就不好用等等。所以我决定自己写一个JavaScript的方法来解决这些问题。

首先，使用此方法的先决条件是：图片显示区域的宽、高必须已知，承载各图片对象的总体父对象的ID必须已知，而且需要按原比例缩放图片，使图片不失真。

可用区域的宽高：<div class="item"><img src="..." alt="..." /></div>，如果设置了“item”的宽为80px，高为100px，那么可用区域就是宽为80px，高为100px。如果设置了padding:4px;border:1px #CCC solid，那么增大的只是实际占用的区域，而可用区域还是原来的值不变。...

二月 24th, 2008Comments(4)Traffic(1665)

傲游下广告屏蔽功能带来的麻烦

一个网站如果有新功能或页面上线的话，大多数的网站都会在首页比较醒目的位置加以宣传。但就是这个宣传图片今天给我带来了不大不小的麻烦。

平时在制作页面时都严格遵循Web标准，使页面兼容各浏览器，但今天有一个同事在做测试时使用了带有广告屏蔽功能的傲游浏览器，宣传图片居然被替换成了：“此广告已经被屏蔽”的文字。

我马上想到很可能是设置了Position:absolute属性（即绝对定位，使层脱离页面漂浮在出来）造成的。因为很多网站的漂浮广告层都设置了此功能。当我去掉此功能后问题却依然存在，看来不是这个的问题，那会是哪里出的问题呢？...

二月 24th, 2008Comments(0)Traffic(569)

标签滑动门技术

因为最近比较忙，所以好久没有上来写文章了。最近有很多朋友问我，能否让标签的背景图片自适应文字的宽度。答案是肯定的，这涉及一个滑动门技术，下面我会以实例向各位朋友介绍这种技术。

目前比较流行的就是两边是圆角，中间是文字的标签。如图：

...

二月 4th, 2008Comments(0)Traffic(685)

使文本保持在同一行中显示

最近有很多网友都在问一个问题：怎么能让多个不固定宽度的对象显示在一行上，如果有对象在剩余空间中显示不下，则换到下一行显示，而不是一个对象分两行显示。

的确，这是令初学者经常困惑的问题，也是经常在设计中用到设置。类似网站模板右侧的标签列表的应用。

下面请看这样一个例子：...

一月 12th, 2008Comments(0)Traffic(545)

max|min-width|height的兼容性测试及设置

昨天在“CSS森林”技术交流群中与朋友们讨论了对象的最大和最小宽高（即max/min-width/height）在各浏览器下兼容的问题。在讨论到此属性是否适用于IE6下的时候持有分歧。下面我举3个例子来说明一下问题。

一、max / min-width / height属性在IE6下无效

目前，这也是我多年工作以来遇到的第一个，在其他浏览器下有效而IE6下无效，并且没有其他属性可以弥补此功能的问题。在以往的工作中体会到，微软总是在做兼容的同时又不失时机的开发出只有IE才可以支持的属性。而相对于max/min-width/height这样方便的属性而言，使我很不理解的是，微软为什么对此弃而不用。...

一月 10th, 2008Comments(0)Traffic(563)