CSS的positon，我想做为一个Web制作者来说都有碰到过，但至于对其是否真正的了解呢？那我就不也说了，至少我自己并不非常的了解其内核的运行。今天在Learn CSS Positioning in Ten Steps一文中分十步介绍了CSS的“position”中的“static、relative、absolute、float”使用，觉得蛮有意思的。整理了一下贴上来与大家一起分享。希望大家能喜欢。
在图解这十个过程之前，我将实例的代码放上来，好让大家一个实体参考：
HTML Markup
outline的使用，大家都喜欢在reset样式表中直接重置：
* { outline: none; }
Eric Meyers在他的CSS Reset是这样重置的：
昨天在《表单button的行高问题》一文中简单的描述了一下表单中的“button”（包括input[type="submit"]/input[type="reset"]/button）行高在Firefox和Opera中不以按设置值解析。今天我想和大家一起来说表单中“button”的“text-indent”属性在IE中的bug。
首先我们来看一个实例：
<input type=”submit” value=”Submit” id=”btn” />
CSS Code
昨天下午@为之给我发了一个有关于button的line-height问题的文章——《The Firefox Input Button Line-Height Bug》。看后明白了许多，顺便整理了一下，与大家一起知道这个问题。
下面我们先来看一个Demo的实例：
HTML Code
<input type="submit" id="button" value="engage"/>
最近一直在学习这个Responsive设计相关知识点，前面我在本站陆续发布了与“Responsive”设计的相关教程：
Progress Bar直译过来就是“进度条”，也就是说今天要和大家一起探讨进度条的作方法。我想进度条大家都有看到过，而且还随处可见，他们表示的是某个过程，显示目前完成状态。最常见的是文件的上传和下载，有一个动态的进度条，通过这个进度可的动态变化告诉我们文件上传或下载的完成程度。换而言之，无论在某一个点或一个桌面程序，或者说我们的Web应用程序或，我们都需要使用到进度条的UI制作。那么在这篇文章中，我和大家一起来学习如何使用CSS3的相关属性来创建一个时尚的、动态的进度条，而且还将扩展一部分jQuery代码，让其从0至100％动态完成。
我们首先来看一看下面的DEMO效果：
下面我们针对上面的DEMO来说说其制作过程。
前面花了几个篇幅着重介绍了CSS的选择器的使用，我将其分成三个部分：CSS基本选择器、CSS属性选择器以及CSS伪类选择器。那么今天我主要想和大家一起来学习——CSS选择器方面的性能优化。因为对性能这一块一直都是很弱的，所以今天先从选择器开始入手，加强自己。如果你也感兴趣那就跟我一起来吧。
今天使用CSS3的伪类“:before”和":after"和animation等相关属性创建一个简单的共享工具提示栏效果。关键的一点是，我使用最少的HTML标签，以及不使用任何jQuery和javaScript脚本。但兼容性就惨了，这个大家都懂的。所以下面的效果只适合Firefox、Safari、Chrome和Opera浏览器。不过这种效果大家在平时制作中肯定常常使用到。那下面我们一起来看如何制作吧。
使用纯CSS代码实现下面的DEMO效果：
Responsive这个词，这段时间公司老是在提，致使我大量的查找相关方面的资料学习。总算是能做出小小的东西出来，也让自己有点满足感。今天我想和大家一起来学习web designer wall的《Responsive Design with CSS3 Media Queries》教程。从这篇教程中，我们可以学会如休何使用CSS3的Media Queries属性来实现Responsive设计。
