September 5, 2008 - by Macji - HTML/CSS/JS/PHP, 前端开发工具 - css, hack, browser
Google浏览器一出，满世间都在议论它，包括我的阅读器，全在说它。它是一个非常优秀的浏览器，尤其是多线程，让我们打开多个网页不再受浏览器的限制，更多好处请Google Chrome 漫画中文版
那到底为什么叫Chrome？其实我也不知道，我只听说在做mozilla插件（firefox）中，有个叫 chrome://的。金山词霸上说:
CHROME（铬合金）滤镜使用映射图来生成变化多端的，奇妙醒目的真实金属效果，如黄金 效果、银金属效果、铜金属效果及其它各种金属效果，所谓映射图就是解压缩的TIFF ...
显然这不是我们要的答案。好在 独行 给出解释：
最早是用在计算机游戏设计上面，人们会说游戏里一些人物造型很“炫”，就是好看不中用，就管这种“炫”的设计叫Chrome，它原意是铬，可能因为铬都闪闪发光？后来就被科普成代表GUI Graphic User Interface了，都可以叫Chrome，再后来，用在浏览器设计上面，就是说浏览器视窗（window）周边的框，也包括上面的导航条，都叫chrome，象一个金属的框。
用chrome打开任何一个网站，然后再其网站搜索后，再在地址栏键入该网站域名按TAB，将自动搜索该网站内容，貌似chrome很强悍，但在它的地址栏里输入" %: "，却立马崩溃，不知道为什么。另外它自带的几个开发者工具，不怎么好用。
大家都知道它是基于webkit的。有人已经写了它所支持的css选择器。http://www.evotech.net/blog/2008/09/google-chrome-browser-css-selector-support/，该网站也列出了chrome的css hack，当然能用在Safari。hedgerwow以前也列过一个Safari hack，当然chrome也能用。。挖挖。绕啊。
@media screen and (-webkit-min-device-pixel-ratio:0){
.your_own_selector{
color:red;
}
}
September 1, 2008 - by Macji - 我的生活 - review
现在博客系统换成WordPress，博客地址为http://www.macji.com/，RSS地址为http://www.macji.com/feed/
也换主机了，感谢 空帷 同学提供主机（上周正愁要不要买MT的主机，那天中午去吃饭的路上，不巧被我听到空帷在喊 “老子有钱，一个人用一个服务器。@#￥%……&×”。喊的好啊，马上跑上去说“我博客放你空间”）。主机是apache的，刚好博客换成WordPress系统（顺便花了点时间做了跟以前一模一样的WP主题），告别以前漏洞百出的自己瞎写的博客。
由于以前买的主机是IIS服务器的，WP不支持IIS的URL重写，网上搜的也写得很麻烦。为了实现URL静态化，于是就想自己写一个算了。那时“冲动”，说干就干了，边看PHP手册边请教PHP达人，遇到很多问题，靠着慢慢琢磨和google，很快程序出来了（我的第三个php程序），系统很简单很简单，那破系统还支持自定义模板呢（挖哈哈）。为了满足我的虚荣心，小秀一下原先的博客系统 ^_^
简单的结构，一目了然，很符合我的个性。
includes目录下就这么几个文件，够轻巧吧。
themes下面放"我所谓"的模板文件，外表都在这里了，跟WP的模板文件差不多。
我更加"骄傲"的是我华丽的后台，
后台首页，然后是我的发表文章的地方，
还可以管理评论哦。
另外值得一提的是，由于懒到家的我，到现在，“友情链接”这功能还没做，我都是手动添加到sidebar.php里去滴。。。
这次博客换成WP了，告别陪伴我半年多的博客系统，以前的数据库结构和WP不一样，手动转了一些文章回来，评论就懒得转了，唉，有点，。。。挖哈哈，难得在博客上写这么多废话，也是值得表扬的，表扬一下麦鸡。
August 31, 2008 - by Macji - HTML/CSS/JS/PHP - css, resource
August 18, 2008 - by Macji - HTML/CSS/JS/PHP - css
1.始终让firefox出现纵向滚动条
让我们的页面不够长的时候， firefox默认不会显示滚动条，只有当页面长度超过浏览器可显示的长度时，才会出现滚动条。那如何让firefox始终显示纵向滚动条呢？
:root{
overflow-y: scroll;
}
但这会使opera9.5出现横向滚动条。如果我们只想给我firefox出现纵向滚动条，那么我们用它的私有属性。
html{
overflow:-moz-scrollbars-vertical;
}
始终让firefox出现纵向滚动条。更多firefox的私有属性
2.防止内容过多从而打乱固定宽度的布局
最简单的布局，就是用float:left加上固定width，但有时容器里面的内容过多，会撑开宽度，打乱布局。
#main{
overflow:hidden;
}
3.防止链接换行
a{
white-space:nowrap;
}
更多css技巧：http://www.cssglobe.com/post/1392/8-premium-one-line-css-tips
July 29, 2008 - by Macji - HTML/CSS/JS/PHP - css, float
我们都知道float:left和float:right，但是否想过float:center呢？居中浮动。。。
<div id="macji">
<ul class="macji-skin">
<li>列表一</li>
<li>列表二</li>
<li>列表三</li>
</ul>
</div>
我们希望实现li是浮动的，并且居中的（li个数不固定，ul宽度未知）。可以设置ul的text-align:center,再设置li的display，可以实现居中，但这样不是我们的初衷，我们需要实现float:center。
这里我们得先重温一下position:relative，它将依据left，right，top，bottom等属性在正常文档流中偏移位置。那我们可以让ul为position:relative;left:50%，然后再让li像左浮动，在让它position:relative;right:50%（或者left:-50%），那么li就像向中间浮动一样居中了。废话不多说，先试试。
#macji{
position:relative;
width:100%;
height:80px;
background-color:#eee;
text-align:center;
overflow:hidden;
}
#macji .macji-skin{
float:left;
position:relative;
left:50%;
}
#macji .macji-skin li{
position:relative;
right:50%;
float:left;
margin:10px;
padding:0 10px;
border:solid 1px #000;
line-height:60px;
}
猛击这里，查看演示»
扩展阅读