Koubei UED

我们经常使用到a,button,input等标签，通过css加背景等方式来实现按钮的效果。但是要做一个通用的样式类，又能保证在各个浏览器下表现一致，还能有很好的扩展性的按纽可不就那么容易了。好了废话少说。进入正题。

首先我们选择a和button两个标签作为通用按纽的外包装器。主要考虑到，在ie6不支持a以外的:hover伪类，使用a就可以对按钮做悬浮状态，这就是为什么选择他们做为最外层的包装器而不是span或者其他的标签。为什么不用input下面会详细说到。

先来认识一下button的类型(type)，button，默认的类型。submit，该可以用来提交表单，功能同<input type=”submit” value=”提交” />。reset，可以用来恢复表单默认值。如下

之前说了，当button的type属性为submit的时候，同样可以对表单进行提交，那为什么要选择button,而不是input。原因有两点。

1. 表单中，在css中可以通过标签名字来作为选择器，对输入框和按钮进行样式控制，在不支持css2属性选择器的浏览器中，这点非常重要。
2. 可以在button内甚至可以嵌入div，p这样的标签标签，其扩展性那是相当的好。

但如果想让button在各个浏览器和各种操作系统下表现一致。还是一件比较让人头疼的事情。 阅读全文»

老外写的.如何写出漂亮的HTML代码.总结的不错.拿出来分享一下.

1.DOCTYPE Properly Declared
别忘记头部的声明.它会告诉浏览器如何渲染你的HTML.

2.Tidy Head Section
设置title,字符集.将CSS和JS外链(包括一个打印用的CSS).

3.Body IDed
给body一个ID.这里作者提到的原因是.为多页面的中容器选择提供便利.比如通过给page1和page2中BODY设置不同的ID.就可以通过#page1 h2和#page2 h2来设置两种不同的效果.我感觉这个到是要看情况和具体架构再具体使用.

4.Semantically Clean Menu
编写符合语意的菜单代码.
<div id=”menu”>
<ul>
<li><a href=”index.php”>Home</a></li>
<li><a href=”about.php”>About</a></li>
<li><a href=”contact.php”>Contact</a></li>
</ul>
</div>

5.Main DIV for all Page Content
要有一个主体DIV包含所有的内容.方便固定主体的宽度,边距等等.

6.Important Content First
先写主要内容,再写次要内容.如果你的导航或者侧边栏不是很重要,最好将他们写在最后.

阅读全文»