为了增加页面的视觉效果，基于WebKit的浏览器可以通过定义伪类 ::-webkit-scrollbar 属性来设置滚动条的属性（大小，颜色，位置，背景等）。注：请使用Chrome浏览器来体验滚动条效果，不支持IE Opera Firefox。

设置 WebKit 浏览器滚动条属性的7条 CSS 伪类：

::-webkit-scrollbar { /* 1 */ }
::-webkit-scrollbar-button { /* 2 */ }
::-webkit-scrollbar-track { /* 3 */ }
::-webkit-scrollbar-track-piece { /* 4 */ }
::-webkit-scrollbar-thumb { /* 5 */ }
::-webkit-scrollbar-corner { /* 6 */ }
::-webkit-resizer { /* 7 */ }

11种滚动条类型

:horizontal（水平方向）和:vertical（垂直方向）使用的最频繁，其他很少使用。

:horizontal
:vertical
:decrement
:increment
:start
:end
:double-button
:single-button
:no-button
:corner-present
:window-inactive

滚动条设置实例：

::-webkit-scrollbar {
width: 12px;
}

::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
border-radius: 10px;
}

::-webkit-scrollbar-thumb {
border-radius: 10px;
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
}

本站滚动条代码如下：

/* Let’s get this party started */
::-webkit-scrollbar {
width: 12px;
}

/* Track */
::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
-webkit-border-radius: 10px;
border-radius: 10px;
}

/* Handle */
::-webkit-scrollbar-thumb {
-webkit-border-radius: 10px;
border-radius: 10px;
background: rgba(255,0,0,0.8);
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
}
::-webkit-scrollbar-thumb:window-inactive {
background: rgba(255,0,0,0.4);
}

您可能也喜欢：
如何设置百度搜索结果显示更多条数	解决Chrome最小字体限制	利用CSS设置透明效果-兼容所有浏览器	HTML5 新增标签 响应事件 浏览器支持 一览表	在WordPress中设置24小时内的文章日期格式为“之前”发表
来自无觅网络的相关文章：
11月份国内主浏览器市场份额排行榜 (@cninin)	Chrome 13成首个没有地址栏的浏览器 (@cninin)	35个横向滚动的网站欣赏 (@sudasuta)	iPad浏览器Apollo整合Facebook Chat (@cninin)	火狐将推Firefox 7浏览器 (@cninin)
无觅

考虑到 SEO，今天给网站唯美爱（weimeiai.com）数据表posts增加了一个post_title字段，即文章标题。

由于之前posts表已经存在1000多条记录，所以当增加post_title字段后，需要填充合适的内容，最终确定文章标题形式为 第 ID 篇，ID为posts表的主键。

post_title填充 第 ID 篇 就使用到MySQL的字符串操作函数concat()，具体MySQL语句如下：

UPDATE posts SET post_title=CONCAT(“第 “,ID,” 篇”)

增加文章标题之后，应该对网站收录会有很大帮助吧，看看后面效果如何。

您可能也喜欢：
使用PHP备份MySQL数据库	Windows 环境下 PHPnow套件 一键安装 Apache + PHP + MySQL	iPhoneMobi.com MySQL 出现数据乱码	如何在数据库中一次更新多行多字段	优化SQL语句，提高数据库执行效率的8条建议
来自无觅网络的相关文章：
MySQL索引背后的数据结构及算法原理 (@flychen)	MySQL双主复制的主备数据一致性知多少 (@flychen)	MYSQL数据库开发步骤 (@wozhutou)	mysql null 值查询问题 (@flychen)	添加skip-innodb后MySQL启动失败 (@citydog)
无觅

HTML5 新增了大量标签和响应事件，并且浏览器种类繁多，对HTML5支持情况不一样，网站设计师很难记住这么多内容，因此在这里分享3个国外网站编写的关于 HTML5 的一览表。

1. HTML5标签 一览表

2. HTML5 事件响应 一览表

3. HTML5浏览器支持情况

WordPress 升级到3.3版本后，新增一次上传多张图片功能，但在图片插入文章过程中，还得一张一张的往里插入，这样的话，多张图片同时上传的最终效果就不是特别明显，图片插入还是费时费力，如果能增加一键插入多张图片的功能就好了。

点击 添加媒体 按钮会弹出下面的对话框，当所有图片完成后，如果你点击 插入到文章 按钮，那么只有这张图片会插入到文章中，其他图片你依然要重复此动作。

我期待的理想效果是：媒体附件列表前面都有 复选框，作者可以根据需要，选择对应的附件，然后一键插入所有附件。

国内采用 HTML5 编写网页的还比较少，但在国外 HTML5 已非常流行，与 HTML5 配套的一些代码工具及HMTL框架也很多，其中一款就是 HTML5 Reset， HTML5 Reset 已提前将常用 HTML5 标签及 CSS3 样式写好，我们只需要在这个框架上进行编写代码即可。

HTML5 Reset 官方网站：http://html5reset.org

官方下载链接

• HTML5 HTML+CSS代码官方下载：https://github.com/murtaugh/HTML5-Reset
• HTML5 WordPress 主题官方下载链接：https://github.com/murtaugh/HTML5-Reset-Wordpress-Theme

本地下载链接：

• HTML5 HTML+CSS代码下载
• HTML5 WordPress 主题下载

上午同学打电话过来，说网站出问题了，具体问题描述如下：网站所有页面均可以访问，但Google管理员工具中显示 404 Not Found错误，导致网站收录数大幅度减少，目前问题还没解决。

网站首页及其他动态页面（PHP）header返回200正常状态，但所有详细页面的 header 均返回 404 Not Found 错误。注：这个网站是用目前比较流行的网店程序ZenCart制作的。

为什么详细页面都可以访问，但却header返回 404 Not Found 错误？那位大侠知道怎么解决这个问题啊。

首页网址结构示例：http://domainname.com/
详细页面 网址结构示例：http://domainname.com/product-123.html

我想了半天，感觉是 URL REWRITE 问题，因为所有动态页面均正常，只有伪静态的详细页面出问题。

2011年11月19日 Update 更新

问题描述：用zencart网站，使用了伪静态，检测全站的404页面时，发现除了首页外，其他页面（伪静态后的页面）都是返回404 的状态码，但是页面又能正常访问。

解决方法：是woz模块有问题，将includes/auto_loaders/config.woz.php 文件去掉就正常了。但具体什么原因我还是没有找到。

到现在我也不知道 WordPress 中 目录和标签 有什么区别，查看 WordPress 数据库时，这二者的数据结构是一样的，没有本质区别，而且据我所知 WordPress 只能调用单一目录或标签下的文章，现在问题来了，如果我想显示 同时 指定目录和指定标签 下的文章该怎么办？

拿本博客举例，如何我想显示 同时满足 目录酷站灵感 和标签HTML5 下的文章该怎么办？今天想用 WordPress 做一个网站的，碰到这个问题，那位高人能否指点一二。

昨天抽时间在 style.css 中增加了 CSS3 Media Queries代码，并且修正了此主题在IE6中的bug（HTML5）问题，目前此主题在IE6中浏览效果良好。

当页面宽度小于640px时，页面样式如下：

默认页面宽度是980px，当页面宽度小于640px时，页面布局会自动切换到 手机浏览模式（宽度320px），能够很好的适应手机屏幕。

CSS3 Media Queries 代码编写示例：

/* media queries mobile */
@media screen and (max-width: 640px) {
/* 在这里重新定义 手机页面的布局样式 */
}

为让IE浏览器支持HTML5和CSS3，需增加下面的代码

<!--[if lt IE 9]>
	<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<!--[if lt IE 9]>
	<script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script>
<![endif]-->

之前在博客左边栏放了一个随页面滑动的Adsense广告，结果被Google Adsense 警告了，让我在3天内整改，今天看到月光博客左边栏底部也挂了一个类似的Adsense广告，为什么他可以挂，而我就不可以……

Google AdSense 发给我的邮件

发现的违规情况：

通过布局诱发意外点击：发布商不得以任何方式鼓励用户点击 Google 广告。这包括可能增加意外点击的方式，例如将广告放在 Flash 游戏或导航栏附近，或将广告和网站链接放在一起。

天下乌鸦一般黑啊，对一些知名一点的大站，即使你违法政策，Google也视而不见，而像我这样的小站，时不时收到Google的恐吓信。

Dreamweaver 经常会将 CSS的属性值分开写，这样会增加 CSS 文件的大小，不利于网页加载速度，所以这里收集了一些常用 CSS 简写代码，不仅能加快 CSS 代码编写速度，而且能减少网页加载时间。