CSS
文章平均质量分 95
雾塔晨钟
WordPress Development Expert
展开
-
简单地利用CSS实现立体效果
用CSS就可以简单地实现文字的立体效果,请看下面的代码[code="html"] #container { width: 600px; height: 180px; margin: 50px auto; padding: 50px 0 0 0; text-align: center; } h1.hello { display: inline; pos...2010-03-09 16:47:37 · 643 阅读 · 0 评论 -
用CSS实现隔列变色的技术
看了zhangjunji111的文章一个用CSS实现隔行变色的技术想起了自己过去的一篇文章十个最简单实用的Table设计模板里面提到了用css+html来实现隔列变色的技术使用 colgroup 和 col 这两个元素属性来定义不同列的 CSS <table> <!-- Colgroup --> <colgrou...2010-01-31 09:28:16 · 358 阅读 · 0 评论 -
CSS 跨浏览器解决方案之一透明度
浏览器的兼容性一直是web开发人员比较头痛的地方之一,众多的浏览器让我们有时无所适从。尤其是IE系列和其他的浏览器总是不兼容,我们通常要为IE6,7书写单独的CSS文件,甚至导致了CSS Hack 这一技术的流行。下面我来谈谈,对于一些流行的CSS效果的跨浏览器解决方案。很多程序员都很奇怪,为什么IE就是就是不支持 opacity 这个属性呢?这个问题已经存在很长很长时间了,其实 ...原创 2010-05-10 14:40:10 · 162 阅读 · 0 评论 -
性感的CD封面 – Javascript + CSS 实现CD封面的变换
网上看到的很有意思的东西,利用Javascript + CSS来变换CD的封面,其中主要是CSS在起作用,实现起来很简单,/* Jewel Case */ ul.music li.jewel img{ width:72px; height:72px; top:3px; left:12px; } ul.music li.jew...2010-01-28 17:41:02 · 440 阅读 · 0 评论 -
CSS技巧之二PNG Fix
大家都知道IE6对于CSS设计者来说,简直就是一坨屎,抱歉用这个词,但是我还真找不到其他更合适的词来形容它,当然仅限于CSS解析方面。IE6有个大Bug就是不支持PNG图片的透明色,这就大大限制了页面的设计。目前网上有很多解决IE6下PNG透明色的方案,从使用IE特有的滤镜或是expression,再到javascript+透明GIF替代.但是这些方法都有一个缺点,就是不支持CSS中backgr...2010-01-27 11:27:33 · 191 阅读 · 0 评论 -
CSS 技巧之一 CSS Sprite
首先看下面的 CSS 代码:li#nav-home a { background:url(../images/navs.png) no-repeat; }li#nav-about a { background:url(../images/navs.png) 0 -28px no-repeat; }li#nav-work a { background:url(../images/n...2010-01-25 23:27:21 · 109 阅读 · 0 评论 -
CSS设计的一些原则
几个月来,也做了不少CSS设计的工作,都是国外的客户,从一开始的啥都不懂,到现在的回头客不少,也算是有点心得了吧,跟大家分享分享。大原则DIV布局因为表格布局会使浏览器的兼容性产生很大问题,比如在手机,掌上电脑用户浏览表格布局会一片混乱,所以最好使用DIV+CSS的布局,事实上我所有的客户,都是这样要求我的。兼容性对于一个好的CSS设计来说,必须保证所有的主流浏览器都能正常地显示,IE6+...2010-01-22 09:22:06 · 389 阅读 · 0 评论 -
十个最简单实用的Table设计模板
表格恐怕是 Web 设计中最困难的一个对象了,感谢神秘的标记语言,有太多的细节我们需要关注了,而且表格缺乏浏览器的兼容性。虽然表格只是一个简单的元素,但是它浪费了我们大量的时间。有人甚至说,标签是垃圾。其实表格本身并没有什么,是你自己使用的不当,把简单的事情弄的复杂了。这就是我写下本篇文章的原因,它将向你展示十个最简单表格设计方法。 准备想必大家都知道 xhtml 1.0...原创 2009-12-31 14:42:06 · 832 阅读 · 0 评论 -
Web开发的第一课 - License
许多开发者和设计者希望把他们的作品作为开源项目共享,他们希望其他人能够利用和共享他们的代码。 而各种开源社区就是因为这个原因而充满活力。开源软件可以用于你能想象得到的任何应用程序,许多web设计人员使用开源软件作为开发基础(例如WordPress,Drupal等等许多CMS系统都是开源的)。 但是许多开发者和设计者并没有对开源License有清楚的了解,不清楚当他们选择开发自己的源...2010-03-25 11:30:38 · 254 阅读 · 0 评论 -
CSS生成跨浏览器的阴影效果
阴影效果是web开发中一个头疼的问题,我做过各种各样的阴影效果,大部分都是用图片生成的,很难定位。现在找到了一种简单的用CSS生成阴影的方法,大家看看下面的例子:[code="html"] div.shadows { margin: 3em auto; width: 25em; font-size: 1.2em; paddin...2010-03-10 09:58:30 · 99 阅读 · 0 评论 -
CSS 跨浏览器解决方案之二梯度
梯度效果也是常用的效果之一,因为浏览器兼容性的原因,很多人都是用背景图片来达到梯度效果的,其实仅仅使用 CSS 就可以实现了。[code="css"].gradient { /* Firefox 3.6 */ background-image: -moz-linear-gradient(top, #81a8cb, #4477a1); /* Safari & Chrom...原创 2010-05-31 14:03:39 · 108 阅读 · 0 评论