定义列表: DL DT DD
九月 6, 2009 by zeze · Leave a Comment
定义列表和其他类型的列表稍有不同，它由两部分组成：名称和定义。DT 指定名称，为内联元素。DD 指定定义，为块级元素。
标准属性
id, class, title, style, dir, lang, xml:lang
事件属性
onclick, ondblclick, onmousedown, onmouseup, onmouseover,
onmousemove, onmouseout, onkeypress, onkeydown, onkeyup
我最常用的10个CSS类
九月 6, 2009 by zeze · Leave a Comment
在指定类名到元素时，许多开发人员常常感到困惑，而且他们也常常在最后才会发现使用的类竟然是错误的。
类名不应当描述元素看起来像什么或在哪里使用它。一个良好的类名应该说明它代表的是些什么内容或功能。这是我最常用的10个类名及其解释，希望能给你一个明确的应该使用什么样的类名的概念。
class=”fixed”
我在每个样式表中都使用这个类名。我将这个类指定在包含浮动子元素的容器上。我要用它来清除该容器内的浮动，使用这些代码：
.fixed:after{ content:"."; display:block; height:0; clear:both; visibility:hidden; } .fixed{ display:block; } /* */ .fixed{ min-height:1%; } * html .fixed{ height:1%; }
XHTML中的alt属性和title属性
九月 6, 2009 by zeze · Leave a Comment
XHTML是CSS布局的基础，52CSS.com一直强调XHTML知识的学习，重视语义和文档的结构。title 和alt 属性，给我最直观的感受就是，可以提高文档的适应性，并合理提高关键词密度。在XHTML标准里，图片的alt 属性是必须的。
alt属性 阅读全文 >>
Pure CSS Animated Progress Bar(纯粹的CSS进度条)
九月 5, 2009 by zeze · Leave a Comment
Here’s a simple demonstration of how you can create animated progress bar using pure css. The trick is very simple. We need 3 elements, one container and 2 nested elements.
The Concept
We’ll put a cool background image in the container and define fixed width and height. First child (SPAN) will act as a progress bar. We’ll absolutely position second child (EM) above the progress bar and shift it to the left to a desired value. EM has the same background as the container so it gives an effect of progress bar stopping at certain percentage.
Markup
To keep it as meaningful as possible I used definition list (DL) to list for several values. For single progress bar you can use any element you want. I love paragraphs so I used P in my example.
<dd> <span><em style="left:100px">50%</em></span> </dd>
I decided to use inline styles for left EM placement. It is more convenient to write both values at the same place at once.
Animation
How is it done? Using animated gif of course. Remember those? SPAN has a 200px wide background gif that animates from “zero” to 200px. No matter what percentage we use it goes all the way and stops. Effect of stopping at certain percentage is done with EM as I mentioned earlier.
EM placement
In my example I use 200 pixels wide progress bar. EM element is also 200px wide. So each percentage is 2px wide. If we want to accurately shift the EM we need to multiply percentages with 2.
i.e. 50% will mean 100px left offset, 24% will mean 48px offset, 75% – 150px etc. You get the picture. 
