leejersey - 博客园

2013年9月9日

摘要：关于fontOK，我们先从font来谈起。如下一段代码：div{font-size:14px;font-family:'\5FAE\8F6F\96C5\9ED1';font-weight:bold;font-style:italic;line-height:28px;}OK，我们看到，这一系列的操作都是针对font的。这些样式，其实我们是可以缩写的。div{font:italicbold14px/28px'\5FAE\8F6F\96C5\9ED1';}5行的代码用一个font搞定，那么这样写是什么意思呢？首先，font系列，也是可以缩写的我们来分析一下上面的例子阅读全文

posted @ 2013-09-09 23:23 leejersey 阅读(3732) 评论(0) 推荐(1)

2013年9月8日

解决IE6不支持position:fixed属性

摘要：最近在优化网站浮动广告时候遇见了IE6不支持position:fixed属性。上网收集了一下解决方案比较好的方案就是利用css表达式进行解决补充：CSS Expression （CSS 表达式），是一种使用动态设置 CSS 属性的方式，并且被 IE5 以上的版本所支持，但是 IE8 的标准模式已不再支持 CSS 表达式了IE7和以上的浏览器都支持position:fixed；之前写过一篇介绍过固定页脚的文字,那时候没在ie6下测试方法一优点:比较简单，方便！就针对IE6的hack缺点：一个页面只能有一个元素是position：absolute 不然所有设置absolute的元素都会浮动方法二阅读全文

posted @ 2013-09-08 21:35 leejersey 阅读(1400) 评论(0) 推荐(0)

CSS hack

摘要： CSS hack 在这个浏览器百花争鸣的时代，作为前端开发的我们为了我们漂亮的设计能适应各个浏览器可为煞费苦心，主要体现在javascript和css上面。javascript我这次就不谈了，先说说css。为了适应不同浏览器不同的版本（版本主要就ie来说），ie这朵奇葩以前我们要兼容6-9，而现在10也出来了，在ie下我们可以写条件注释来区分ie和其他浏览器，以及ie的版本，这些请大家自行去搜索吧。不过ie10这朵奇葩，丫的居然不支持条件注释。在这里向ie10的开发工程师的全家问“好”。Ok，废话不多说了。直接上代码。.test{background:#f00;/*各浏览器都认识，主要给.. 阅读全文

posted @ 2013-09-08 16:31 leejersey 阅读(1039) 评论(0) 推荐(0)

IE6文字溢出BUG(多出来的猪问题)

摘要：在IE6下使用浮动可能会出现文字重复的情况.在IE6下，浮动层之间有注释文字的话，之前那个浮动层的内容文字就有可能遭遇一个“隐形”的复制，但是代码里查看文字可并没有多出来。看个例子：HTML 歌剧院的魅影用IE6看一下，你会发现真的会多出一只“猪”！问题原因以及解决方法：原因：由注释造成文字溢出，属于IE6的BUG，溢出文字的字数=注释的条数*2-1，这里的字数在中文或英文数字时都成立。注释坐在位置与溢出位置、区块的浮动以及文字区块的固定宽度有必然联系。解决办法：1、不放置注释。最简单、最快捷的解决方法；2、注释不要放置于2个浮动的区块之间；3、将文字区块包含在新的之间，... 阅读全文

posted @ 2013-09-08 14:22 leejersey 阅读(1402) 评论(0) 推荐(0)

li在IE中底部空行的BUG

摘要： li在IE中底部空行的BUG但是这次li在IE中底部出现的不是3像素而是一整条空白行，如图：HTML代码：第1条连接第2条连接第3条连接CSS代码：* {padding:0;margin:0;}li { }li a {background:#CCC;border-bottom:1px #000 solid;text-decoration:none;display: block;}li a:hover {background:#BBB;}查看demo，请使用IE6查看：http://www.css88.com/demo/IE6_bug/ie6-li/ie6-bug.htmlIE6中列... 阅读全文

posted @ 2013-09-08 13:52 leejersey 阅读(974) 评论(0) 推荐(0)

利用css中的border生成三角，兼容包括IE6的主流浏览器

摘要： 1、生成四个不同颜色方向的梯形#ladder{ width:20px; height:20px; border:10px solid; border-color:#ff3300 #0000ff #339966 #00ff00; }2、只显示一个方向的梯形#ladder-top{ width:20px; height:20px; border:10px solid; border-color:#ff3300 transparent transparent transparent; border-style:solid dashed dashed dashed; }#ladder-bottom{ 阅读全文

posted @ 2013-09-08 10:37 leejersey 阅读(1335) 评论(0) 推荐(0)

跨浏览器实现盒阴影(box-shadow)效果

摘要：现在流行的设计里总是使用了大量的阴影，看看Vista、win7里夸张的box阴影，mac里的阴影比比皆是。CSS3的box-shadow属性可以让我们轻松实现图层阴影效果，使我们可以不再总是依赖于使用图片。实现盒模型阴影的综合代码：/*Internet Explorer*/background:#fff;/*Internet Explorer 8 */-ms-filter:"progid:DXImageTransform.Microsoft.Shadow(color=#CCCCCC,direction=0,strength=6) progid:DXImageTransfor... 阅读全文

posted @ 2013-09-08 00:31 leejersey 阅读(6338) 评论(0) 推荐(0)

2013年9月7日

li下用了浮动IE6的问题

摘要： li下用了浮动IE6的问题直接看HTML 沃尔沃认为认为沃尔沃认为认为沃尔沃认为认为沃尔沃认为认为html代码很简单CSSul{ clear:both; overflow:hidden; padding:10px 10px 0;}ul li{ float:left; width:210px; line-height:24px; height:24px; background:red url(../images/greenicon.gif) no-repeat 0px 8px; padding-left:12px; }要实... 阅读全文

posted @ 2013-09-07 21:35 leejersey 阅读(1159) 评论(0) 推荐(0)

2013年8月23日

IE下实现类似CSS3 text-shadow文字阴影的几种方法

摘要： IE下实现类似CSS3 text-shadow文字阴影的几种方法一、开始的擦边话为了测试IE9浏览器，下午晃晃荡荡把系统换成window7的了。果然，正如网上所传言的一样，IE9浏览器确实不支持CSS3text-shadow属性，且根据最近的IE10 preview版的反馈，IE10浏览器也是不支持text-shadow属性的。至于为何不支持，就像女孩的心思一样，我也是百思不得其解。不过考虑到text-shadow的更多的是效果性质的属性，且潜力有限，所以，就我个人而言，最近版本的IE浏览器不支持该属性我还是相对比较淡然的。虽然IE浏览器不支持text-shadow文字阴影属性，但是我们可以使阅读全文

posted @ 2013-08-23 20:32 leejersey 阅读(4645) 评论(0) 推荐(0)

2013年8月21日

IE6中奇数宽高的BUG

摘要：一个外部的相对定位div，内部一个绝对定位的div（right:0），如图：可是在IE6下查看，却变成了right:1px的效果了：IE6还有奇数宽高的bug，解决方案就是将外部相对定位的div宽度改成偶数。高度也是一样的查看源码：XML/HTML代码: 此处为内部绝对定位的 DIVCSS代码:#out {width: 609px;/*这里宽度为奇数，bug就出现了！！改成偶数就OK了*/height: 300px;position: relative;background:#FF0000;color:#FFF;}#inn {width: 200px;height: 250px;posi... 阅读全文

posted @ 2013-08-21 11:32 leejersey 阅读(318) 评论(0) 推荐(0)

专注WEB前端开发

爱设计，爱编程，专注WEB前端开发