又要把SEO摆上日程了。
去年做一个站的时候曾经把header区域写在最后，position到上面，在文档流中让内容区出现在前面。但是最后习惯性屏掉CSS看结构的时候无比别扭。
sidebar和content左右位置互换是因为大多数情况下文章详情页里的重点是文章本身，sidebar放置到文档流靠后的位置也可以说的过去，但是页头这个问题，总觉得相当纠结，除了功利化的SEO没有其他任何理由。
决定无视这种做法，就像总监想招JS，要我写招聘说明，我引用了其他文章里出现的话语：你对一门语言的尊重，决定了你能达到的高度。
不同的仅仅是，JS是长期被扣上弱语言的帽子而导致不被尊重，HTML语义化因为很难被看到商业价值而被忽视。
Reset CSS的存在，只是因为HTML元素都有自己默认的样式，而且各个浏览器里的预设样式可能都不同——W3C上有详细的HTML 4元素的默认样式说明文档。这种情况下先废后立，把所有浏览器自带的样式进行统一，然后再重新定义，可以避免各浏览器对不同的HTML元素样式解析不同的问题。
这是YUI的Reset CSS：
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,
th,td {
margin:0;
padding:0;
}
table {
border-collapse:collapse;
border-spacing:0;
}
fieldset,img {
border:0;
}
address,caption,cite,code,dfn,em,strong,th,var {
font-style:normal;
font-weight:normal;
}
ol,ul {
list-style:none;
}
caption,th {
text-align:left;
}
h1,h2,h3,h4,h5,h6 {
font-size:100%;
font-weight:normal;
}
q:before,q:after {
content:'';
}
abbr,acronym { border:0;
}做demo的时候会使用*{margin:0;padding:0;}，但是正式做项目的时候还是使用了Yahoo的这套预置样式，只不过去除了一些很少用的元素，比如语法有争议的abbr,acronym，很少用的pre、address、cite、code、dfn、var,以及q:after和q:before。
CSS权威指南的作者Eric Meyer也有对应版本的reset样式：http://meyerweb.com/eric/tools/css/reset/，并被用在了CSS框架blueprintcss上。主要区别在于预置了一些元素的outline和vertical-align属性。
懒人的做法是直接copy，如果要减少CSS文件那么几个字节的话，根据自己项目中使用到的HTML元素各取所需就好。
我们网站使用的编辑器是kindeditor。昨天给程序重构的页面嵌套程序时，程序员讲编辑器的下拉菜单不能用了
查了下kindeditor的代码，发现作者定义了下拉菜单为position:absolute，参照对象则是用函数计算出的坐标。
但是我布局中使用到了position:relative，所以下拉菜单的定位参照物变了，直接漂浮到容器外面；
同时，放置编辑器的容器因为清除浮动高度带上了overflow:hidden，漂浮的内容超出了容器范围，而不显示了。
解决思路有两个：
1，有没有办法把定义了position:relative下的子容器消除掉position属性；
2，修改编辑器的坐标计算参数。
第一个尝试未果；第二个JS刚开始学，还做不到。备忘
做项目的时候，我在CSS里写reset都会先把ul和ol的list-style清除掉，两者外观看上去相同，只是根据需要罗列的列表内容去判定使用哪个以符合语义化。
如果需要显示数字序列号，则交由程序输出数字。
今天在老外blog上看到另外一种思路：这篇文章，通过显示ol的序列号数字，并单独给数字文字定义字体样式实现。
补充：前几天去面试的时候也碰到他们有这个问题，如图
当时出于减少网页并发数请求考虑，我的实现想法有两种：
一是把所有序号图片切到一张大图上作为区域的背景图片左对齐；
二是导出黑色和红色两个数字的背景图片，数字交由程序或者通过上面所写的ol显示序号的方法实现。
但是讨论了下，可能会遇到字体不能符合设计的问题，设计的时候选用的字体可能用户终端没有安装。
CSS书写：
filter:alpha(opacity=80);
opacity:0.8;
其中filter为IE6的私有属性；
opacity为CSS3的属性，目前标准浏览器如Firefox、Safari都支持。但是Opera 9.0版本后才支持。
数值中IE的80和CSS3里的0.8是相同的，即百分比和小数.
——————————
如果你用的IE7，那么会发现这些代码是无效的。
——神奇的微软，在IE7及以上版本里连自家的filter也不可用了，但是也不支持CSS3。所以这种办法在IE7无效。
问题出在每个页面顶部的DTD上，有兴趣的可以阅读DOCTYPE声明相关的文档。
这里可以通过另外种办法来实现：透明PNG背景图。可以给父容器设置半透明的PNG背景图来实现上面效果。各个标准浏览器都支持（前面提到的Opera 9.0之前不支持opacity，但是他支持PNG透明），IE7也开始支持。
遗憾的是，IE6不支持，但是有JS可以使IE6也支持透明PNG。