标签： CSS

为了哀悼日，网页颜色黑白CSS代码

Wolfit 12 条评论

昨天又是哀悼日，全国停止一些娱乐活动，哀悼在舟曲泥石流中死去的生命。

如果没有记错，这已经是继2008年“5·12”地震以来的第三次哀悼日了，默默的感觉到以后的哀悼日可能会越来越多，所以找来这些代码，以备不时之需。

以下是CSS滤镜代码，两种都行，如果你还不知道添加在哪里，就请跳过这篇文章好了。

html{filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);}  

*{filter:gray; color:gray;}  

网页标准的协议也很重要，下面的标准最常用，否则可能无效

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

有一些网站中flash的颜色不能被CSS滤镜控制，可以在flash代码的<object>和</object>之间插入

<param value="false" name="menu"/>
<param value="opaque" name="wmode"/>

PS：以上CSS滤镜代码可能只在IE下有效，其他浏览器未验证。

引用块（Blockquote）CSS效果

Wolfit 3 条评论

blockquote标签表示引用块，这个大家都知道。Z-Blog后台使用的 fckeditor 2.5 就有这个标签的按钮，个人曾经认为这是个鸡肋按钮。但是只要定义两个简单的CSS，就可以大展拳脚了。还是看效果先：

Blockquote在blog和论坛中使用的比较多，很多网站都可以看到。使用 <blockquote>标签可以在屏幕上用分离的块显示大段的引用。与行内引用不同，块引用可以包含块级元素，诸如<p>、<table>等。多数浏览器通常改变引用部分的页边界，以和周围的文本区分开。可选的cite属性提供了引用来源的URL，这一属性尽管未广泛被各种浏览器支持，但能使用户方便的验证引用的正确性。Blockquote标签是成对出现的，以<blockquote>开始，以</blockquote>结束，常用属性如下：
Common – 一般属性

继续阅读

根据时间段自动切换你的站点CSS风格

Wolfit 3 条评论

网站能切换几套CSS风格早已不是什么新鲜事了。大家也都知道怎么去弄。今天发现一个有意思的站点http://www.leemunroe.com/ 。

同样是切换风格。不过他做了一点小小的调整。站点会根据当时的时间自动调整站点风格。作者为站点制作了早上、下午、夜晚三套皮肤，主要是分别制作了背景。12点以前系统会使用早上的皮肤，过了12点，站点会自动替换成下午的风格，5点后则替换成夜晚的风格。

主要的功能实现是靠在头部的这段判断代码，很容易理解。有兴趣的朋友不妨试试。

PHP版代码如下：

以下是代码片段：
<link rel=”stylesheet” type=”text/css”
href=”<?php $hour = date(“H”); if ($hour < 12) echo “morning.css”; elseif ($hour < 17) echo “day.css”; else echo “night.css”; ?>
” />

ASP版代码如下： 继续阅读

CSS实现半透明效果

Wolfit 评论

设计网页或者制作blog模板的时候，往往会用到让某部分实现透明或者半透明的效果，这时候我们该怎么办呢？

在IE中需要通过”filter”来定义透明度”opacity”。

而在Firefox中是可以直接解析”opacity”，所以如果要使得这个效果在两种浏览器中都得到支持，需要把两种设定都加进去。

针对IE的设定：this.filters.alpha.opacity=50
针对Firefox的设定：this.style.MozOpacity=0.5

大家可以直接用下面代码给图片定义，只须修改图片地址就能实现上图的效果。其实不只图片可以实现这个CSS滤镜，网页也是可以的！

以下是代码片段：
<img alt=”powerbookg4.jpg” src=”archives/images/powerbookg4.jpg” width=”250″ height=”60″ style=”-moz-opacity:0.5; filter:alpha(opacity=50);cursor:hand;” onmouseover=”this.style.MozOpacity=1;
this.filters.alpha.opacity=100″ onmouseout=”this.style.MozOpacity=0.5;
this.filters.alpha.opacity=50″>

继续阅读