深山老林

2007-03-27麻木

近来有点麻木了，面对一堆工作也不会冒冷汗。觉得生活为啥要那么累？上班时间上班，下班时间下班，多好？理想是什么？一种动力，也是一种负担。生命是一个过程，一个认知生命意义、了解生命的过程，明白最终是为了什么而死，生命也就完结了。说白了，人是为了死后能在别人心里活多久而活着。

无语了，该怎么活怎么活去…… 

2007-01-22[分享]DIV内容垂直居中

在CSSPlay上看到了一个垂直居中的例子，感觉还是不错的，跟大家分享一下：

======================CSS=======================
.holder{
 width:740px;
 height:300px;
 border:1px solid #777;
 text-align:center;
 display:table-cell;
 vertical-align:middle;
}
/*以下样式针对IE*/
.edge{
 width:0;
 height:100%;
 display:inline-block;
 vertical-align:middle;
}
.container{
 vertical-align:middle;
 display:inline-block;
}
================================================

====================HTML=======================
<div class="holder">
<!--[if IE]><span class="edge"></span><![endif]-->
<!--[if IE]><span class="container"><![endif]--><img src="http://img68.imageshack.us/img68/8708/mylogo9we.gif" alt="Homework" title="Homework" />测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容<!--[if IE]></span><![endif]-->
</div>
=================================================

代码改动了一点点。有两点必须要注意的：

1. HTML中IE条件注解部分的标签要用内联对象标签。
2. “<!--[if IE]><span class="edge"></span><![endif]-->”要放在内容之前。如果放在之后，内容是中文时会不能居中。

2007-01-17[原]ImgView加强版

ImgView的加强版，可惜现在只能在FF跟IE7里显示正常。-_-||

难题，有空再搞过……

Demo

2007-01-16[原]CSS制作的图片浏览效果－－ImgView

昨晚心血来潮做了个CSS的图片浏览效果，貌似很常见……

还是看看 DEMO 吧。

2007-01-08[原]九宫格生成脚本 -- GNineBox v2.1

GNineBox的2.1版本，支持Opera。

/* =================== GNineBox v2.1 ===============================
GNineBox("jgClass")
GNineBox("类名")

功能说明：
GNineBox是一个生成九宫格的程序。也可用于制作圆角。

版本更新历史：
v2.1：支持Opera。
v2.0：可通过CSS样式定义九宫格外框样式，实现表现跟内容分离。
（已知问题：不支持Opera）

版权信息：
本程序是自由程序，使用请保留本标注。

作者信息：
Ghost Zhang
Email:lovej1bz@gmail.com
QQ:22168741
ORG:www.WebReBuild.ORG www.CSSForest.ORG
Blog:http://forest.blogbus.com

使用说明：
只需要通过CSS样式定义要应该九宫格的class类的公共图片名称即可。
例：
定义样式：.gnb{background:url("gn.gif");}或
.gnb{background-image:url("gn.gif");}
只需要给出图片名称前面的公共名即可，如图片名分别为“gn_tl.gif”、
“gn_tm.gif”、“gn_tr.gif”，只要imgName定义为“gn”。
在页面最下面加入：<script type="text/javascript">GNineBox("GNB");</script>

GNineBox的样式的定义优先级如下：
标签级样式，如：<div class="gnb" style="background-image:url(gn.gif)">...</div>
文件级样式，如：<style type="text/css">.gnb{background-image:url(gn.gif)} </style>
外联样式，如：<link rel="stylesheet" rev="stylesheet" href="style.css" type="text/css" media="screen" />

没有层级的关系，即.top .gnb{background-image:url(gn.gif)}与.gnb{background-image:url(gn.gif)}是相等的。
在文件级样式或外联样式中，最后的定义会被使用，即：
如果同时定义了.top .gnb{background-image:url(gn.gif)}和.gnb{background-image:url(gn2.gif)}
那么.gnb{background-image:url(gn2.gif)}会被应用。

注意：FireFox跟Opera对路径中的空格必须解析为%20。
如果background的image路径中出现空格，请将其改为%20，以确保路径能被正确读取。
如：
background-image:url(http://www.cssforest.org/trys/gninebox 2.0/bg.gif);
应该写为：
background-image:url(http://www.cssforest.org/trys/gninebox%202.0/bg.gif);
========================================================================*/

GNineBox 2.1Demo

下载GNineBox v2.1