随笔分类 - css3
摘要:今天,群里有人问道font-size 2 3 4 5 JS Bin 6 7 8 Font Size 16px 9 Font Size 15px 10 Font Size 14px 11 Font Size 13px 12 Font Size 12px 13 ...
阅读全文
摘要:一天一个效果让我头疼,就是如何让文本模糊,然后里面的内容seo还能搜索到,如果有链接的话,还可以点击。还有最关键的就是要兼容ie6,7,但是经过我一天的努力,只能兼容到ie7.下面就听我慢慢跟你唠叨这里面的东东。 先看一下我们要实现的效果上面那个是图片,下面红框里面才是我们要实现的效果。 这个东东我用到了几样东西:text-shadow,color,你可能会怀疑这个怎么能出这个效果呢? 大家都知道text-shadow是可以模糊文字的,但是这里color是个什么来路呢?哈,他才是今天的主角。先卖个关子,看代码: 1 2 3 4 5 Document 6 12 ...
阅读全文
摘要:今天问了一个问题:border是算在width里面还是外面,我说是里面,然后他又接着引申了一下问题:如果border很大,而且元素有背景色,那背景色是在border里还是外面?又问,如果元素有背景图,那背景图平铺的话,会在border里面还是外面?接着问,如果背景图不平铺的话,会在border里面还是外面?我让这一连串的问题问晕了,然后就挨个试验,试验是检验真理保证嘛! 试验结果发现好神奇,如果有背景色的话,背景色会在border外面消失;如果有背景图平铺的话,背景图会在border外面消失;如果有背景图不平铺的话,背景图会在border里面就消失。而且,还发现background-col..
阅读全文
摘要:这个跟上一篇是同一类,但是有点不同,那个是边框+小气泡三角,这个是渐变背景+小气泡三角,而且我还换了一个实现手法。 1 .down_tip{position:relative;width:300px;height:50px; 2 background: #f9d835; /* Old browsers */ 3 /* IE9 SVG, needs conditional override of 'filter' to 'none' */ 4 background: url(data:image/svg+xml;base64,PD94bWwgdm...
阅读全文
摘要:以前遇到textarea上面有小三角气泡,总是把小三角气泡单独切下来,然后再绝对定位上去。今天,切页面我就换了一个方法,用纯css上! 其实原理很简单:就是让两个小三角叠起来,上面的小三角往一侧错一下位,就刚好露出下面小三角的边,为此上下三角的颜色是不同的,而且需要上面的小三角盖住下面的三角。所以,上面的小三角为白色,下面的小三角是你想要的边框颜色。也就是border-color不同。为了能达到这个效果,要求两个小三角要一样大小,也就是border-width要一样。 下面直接上代码:1 /*右侧气泡 兼容firefox chrome safari ie6,7,8,9*/2 .right_..
阅读全文