作 者:笑傲江湖分 类: 百 宝 箱 发布于:2012年-8月-1日 14:27 星期三
/* style fix for chrome & safari */ @media screen and (-webkit-min-device-pixel-ratio:0) { .yourclass { } #yourid { } } /* style fix for firefox */ @-moz-document url-prefix() { .yourclass { } #yourid { } } /* style fix for opera */ @media not screen and (1) {} /* 这一行不要删除,否则下面的不起作用。 */ @media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0) { .yourclass { } #yourid { } } /* 测试浏览器版本:chrome 20.0.1132.57 、firefox 12.0、opera 11.62 可用,其他版本未测试 */
作 者:笑傲江湖分 类: 百 宝 箱 发布于:2012年-7月-13日 21:28 星期五
tablayout.zip
5.72KB
作 者:笑傲江湖分 类: 百 宝 箱 发布于:2012年-7月-8日 15:27 星期日
div#box { width: 100px; border: 2px solid black; padding: 10px; }这个样式定义的box的宽度,对于IE6来说,就是100px,但是对于其他比较流行的浏览器,宽度是124px,这问题就很明显了,有了这个差异,网页的布局会有问题,所以这个的注意。
div#box { width: 100px; border: 2px solid black; padding: 10px; float: right; margin-right: 20px; }这个box元素咱们需要它Float到右边,且右边距是20px,实际上IE6会把边距加倍,成了40px,这又是个把你的布局彻底打乱的一个Bug,解决之道当然是有的,就是再加一个定义,"display:inline;"。问题是可以解决,但是有时你可能并不想要这个元素是inline的啊,所以实际使用中你得自己解决实际需求。
作 者:笑傲江湖分 类: 百 宝 箱 发布于:2012年-6月-15日 16:53 星期五
css3-product-showcase.zip
378.07KB
作 者:笑傲江湖分 类: 百 宝 箱 发布于:2012年-6月-14日 0:18 星期四
FullscreenSlitSlider.zip
218.63KB