在我们写样式的时候，页面的CSS在经历几个版本的修改之后，可能有些样式已经用不到了，或许将某些样式更名了而原来的忘了删除，总之页面中可能存在着一些无用的样式。这些无用的浪费了一些服务器空间和带宽消耗，也会增大我们的维护成本。那么有没有一些办法来清理那些无用的样式呢？今天就让我们来了解一下几个比较有用的工具。
Dust-Me selectors
Dust-Me是一个很有用也很好用的Firefox插件，它可以分析到你的页面中调用的所有CSS文件并分析那些在页面中没有被用到。
支持本地和远程样式文件，包括使用link标签、< ?xml-stylesheet?>处理指令、 at import语句等方式引入的样式文件；(但是不支持页面中的style块和内联样式)
支持IE条件注释中引入的样式文件；
可以检查一个页面，也可以检查整个网站；
支持CSS1选择器、大部分CSS2和CSS3选择器；
理解通用的CSS hack，比如 “* html #fuck-ie”将会被认为是”html #fuck-ie”；
支持Firefox 3 dot 5和Firefox 3.0，事实上得益于FF 3.5的js引擎的改进，FF 3.5中的性能比FF 3.0要高50%。
安装：点击这里。了解更多请访问 Dust-Me selector官方页面。
Page Speed
Page Speed是Google提供的一个前端性能分析工具，有些类似于YSlow，但是提供了一些比较个性且很有用的工具，比如Remove unused CSS.
Page Speed和YSlow一样依赖Firebug，了解详情和安装请访问这里。
CSS Redundancy Checker
CSS Redundancy Checker 是一个免费的在线应用，可以检查所有的使用某个CSS文件的页面中无用的样式。可以同时检查某一个样式在多个页面中的使用情况。该工具的不足是虽然一次能检查多个HTML页面，但每次只能检查一个CSS文件，而且还要手动输入
http://services.immike.net/css-checker/
IntelliJ IDEA
IntelliJ IDEA 这是一个颇强大的IDE，类似于DreamWeaver，不过在国内用的不多。该软件包括一个即时代码分析工具(On-the-fly Code Analysis)，可以分析CSS文件中未用到的class和id。
Expression Web
Expression Web作为微软的新一代网站开发工具，还是有很多人使用的，其CSS Report功能可以检查未用到需要被清除的CSS（我的确没有使用EW开发过网站，希望使用该软件的童鞋可以帮忙确认一下这一点）
在Web标准中的页面布局是使用Div配合CSS来实现的。这其中最常用到的就是使整个页面水平居中的效果，这是在页面布局中基本，也是最应该首先掌握的知识。不过，还是经常会有人问到这个问题，在这里我简单总结一下使用Div和CSS实现页面水平居中的方法：
一、margin:auto 0 与 text-aligh:center
在现代浏览器（如Internet Explorer 7、Firefox、Opera等）现代浏览器实现水平居中的方法很简单，只要设定到左右两侧的空白为自动即可。意即：
#wrap { margin:0 auto; }
上面这段代码的意思是说使wrap这个div到左右两侧的距离自动设置，上下为0（可以为任意）。请在现代浏览器（如Internet Explorer 7、Firefox、Opera等）中运行现在的代码：
＜!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtm......1-transitional.dtd"＞
＜html xmlns="http://www.w3.org/1999/xhtml"＞
＜head＞
＜title＞ new document ＜/title＞
＜meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /＞
＜style type="text/css"＞
div#wrap {
width:760px;
margin:0 auto;
border:1px solid #333;
background-color:#ccc;
}
＜/style＞
＜/head＞
＜body＞
＜div id="wrap"＞
在Firefox等现代浏览器设定页面元素的水平居中，只要指定margin:0 auto;即可
＜pre＞
div#wrap {
width:760px;
margin:0 auto; /*这里的0可以任意值*/
border:1px solid #ccc;
background-color:#999;
}
＜/pre＞
＜/div＞
＜/body＞
＜/html＞
上面的效果很好。但是这在Internet Explorer 6及改正的版本中是不起作用的，不过幸好它有自己的解决办法。在Internet Explorer中text-align属性是可继承的，即在父元素中设置后在子元素中就默认具有了该属性。因此我们可以在body标签中设置text-align属性值为center，这样页面内所有的元素都会自动居中，同时我们还要加一个hook把页面中的文字变成我们习惯的阅读方式——居左对齐。因此我们要如此来写代码：
body { text-align:center; }
#wrap { text-align:left; }
这样在Internet Explorer中我们就轻松实现了Div的居中对齐。因此要在所有的浏览器中显示居中的效果，我们就可以这样写我们的代码：
body { text-align:center; }
#wrap { text-align:left;
margin:0 auto;
}
＜!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtm......1-transitional.dtd"＞
＜html xmlns="http://www.w3.org/1999/xhtml"＞
＜head＞
＜title＞ CSS+Div实现水平居中对齐的页面布局 ＜/title＞
＜meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /＞
＜style type="text/css"＞
body { text-align:center; }
div#wrap {
text-align:left;
width:760px;
margin:0 auto;
border:1px solid #333;
background-color:#ccc;
}
＜/style＞
＜/head＞
＜body＞
＜div id="wrap"＞
在Firefox等现代浏览器设定页面元素的水平居中，只要指定margin:0 auto;即可
＜pre＞
div#wrap {
width:760px;
margin:0 auto; /*这里的0可以任意值*/
border:1px solid #ccc;
background-color:#999;
}
在Internet Explorer 6 及以下的版本中我们还要做以下的设置：
body { text-align:center; }
div#wrap {
text-align:left;
}
＜/pre＞
＜/div＞
＜/body＞
＜/html＞
不过这里有一个前提，就是设置居中的元素要有固定的宽度，比如这里我们设定了为760像素。
二、相对定位与负的边距
对于wrap进行相对定位，然后使用负的边距抵消偏移量。这种方法比较简单还很容易实现：
#wrap {
position:relative;
width:760px;
left:50%;
margin-left:-380px
}
这段代码的意思是，设置wrap的定位是相对于其父元素body标签的，然后将其左边框移动到页面的正中间（也就是left:50%含意）；最后我们再从中间位置向左偏移回一半的距离来，这样就实现了水平居中了。
＜!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtm......1-transitional.dtd"＞
＜html xmlns="http://www.w3.org/1999/xhtml"＞
＜head＞
＜title＞ CSS+Div实现水平居中对齐的页面布局 ＜/title＞
＜meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /＞
＜style type="text/css"＞
div#wrap {
position:relative;
width:760px;
left:50%;
margin-left:-380px;
border:1px solid #333;
background-color:#ccc;
}
＜/style＞
＜/head＞
＜body＞
＜div id="wrap"＞
在所有浏览器中都有效的方法：
＜pre＞
div#wrap {
position:relative;
width:760px;
left:50%;
margin-left:-380px;
border:1px solid #333;
background-color:#ccc;
}
＜/pre＞
＜/div＞
＜/body＞
＜/html＞
同样，在设定水平居中前你需要设定一个固定的宽度。
P.S.究竟选择哪个方法？
上面两个方法究竟选择哪种方法好呢？在第一种方法中貌似使用了Hack技术，其实并没有，它是中规中矩的Web标准写法，完全符合规范，因此，两个种方法中完全可以随便的选取其中的任一种进行使用，他们不存在CSS hack的问题。
三、其它的居中方式
上面所说的都是设定了具体宽度的情况下水平居中的实现。有时候我们想做一个弹性布局，或者当一个元素处于一个容器中时我们只想让它居中并不想设定一个具体的宽度。其实这并不是真正的居中布局，就像对一个100%长度的元素来说，你说它是居中对齐还是居左对齐呢？所以所有不高宽度的居中都不是真正的居中。这样的设计我们是使用的像元素的padding来设置的，实际中我们是改变了父元素的容器大小：
如我们希望wrap元素长度随窗口而改变，同时又维持居中，我们就可以这样写：
body {
padding:10px 150px;
}
这里，我们只需要保持父元素左右两侧的填充是相等的就可以了。
＜!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtm......1-transitional.dtd"＞
＜html xmlns="http://www.w3.org/1999/xhtml"＞
＜head＞
＜title＞ 随浏览器窗口大小而改变的具有弹性的居中布局 ＜/title＞
＜meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /＞
＜style type="text/css"＞
body {
padding:10px 150px;
}
div#wrap {
border:1px solid #333;
background-color:#ccc;
}
＜/style＞
＜/head＞
＜body＞
＜div id="wrap"＞
一种随浏览器窗口大小而改变的具有弹性的居中布局：
＜pre＞
body {
padding:10px 150px;
}
这里，我们只需要保持父元素左右两侧的填充是相等的就可以了。
＜/pre＞
＜/div＞
＜/body＞
＜/html＞
当然这只是“貌似居中”，不过却常常很有用处。
UseEncoding UTF-8 GBK
但是启动的时候出现错误，不认UseEncoding 选项，于是重新编译：
./configure --prefix=/usr/local/proftpd --with-modules=mod_sql:mod_sql_mysql:mod_quotatab:mod_quotatab_sql --with-includes=/usr/local/mysql/include/mysql --with-libraries=/usr/local/mysql/lib/mysql --enable-ctrls --enable-nls --enable-shadow --enable-dso --enable-autoshadow --enable-auth-pam
make
make install
完成后重启proftpd，问题解决