CSS已经成为网页前段设计一个非常重要的部分，由于写CSS时需要考虑的问题非常多，老手们创建新页面是通常会沿用以前的CSS框架。但是新手没有自己的框架，这篇文章可以给新手们一些启示。
1.简单的纯CSS Tooltip
通过这些代码，你可以做出简单的Tooltip。这是CSS
代码：
以下为引用的内容：
a:hover { background:#ffffff; /*要兼容IE6的话必须添加背景色*/ text-decoration:none;}a.tooltip span { display:none; padding:2px 3px; margin-left:8px; width:130px;}a.tooltip:hover span{ display:inline; position:absolute; background:#ffffff; border:1px solid #cccccc; color:#6c6c6c;}
HTML代码如下：
以下为引用的内容：
Easy <a class="tooltip" href="#">Tooltip<span>This is a Example by imbolo.com.</span></a>.
效果如图。
2.重设基本样式
为了统一不同浏览器对各种HTML标签的默认样式的渲染，我们必须从新定义各种标签的样式，这样能对以后的开发带来方便。重新定义各种HTML标签只需要在CSS的开头加入以下代码。
以下为引用的内容：
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent;}body { line-height: 1;}ol, ul { list-style: none;}blockquote, q { quotes: none;}blockquote:before, blockquote:after,q:before, q:after { content: none;} /* 元素获得焦点时的样式! */:focus { outline: 0;} /* 特殊文本的样式! */ins { text-decoration: none;}del { text-decoration: line-through;} /* 细线表格样式 */table { border-collapse: collapse; border-spacing: 0;}
3.方便的CSS调试器
这段代码可以把页面上的各种标签嵌套用不同的线条划分出来，方便你找出BUG。
以下为引用的内容：
* { outline: 2px
