分类目录归档：前端

HTML/CSS细节

HTML/CSS的相对来说比编程简单，甚至简单很多。

可以用Dreamweaver快速学习上手，但最好学会手写，使用editplus/Notepad++。

不一定要懂最新的，例如HTML5/CSS3，但一定要懂标准的，简单的东西差别在于细节。

以下是一些总结（持续更新）

编写XHTML而不是”HTML”

XHTML的一些特点

1)正确嵌套元素:,不能，span与p区交叉。

2)结束标签

3)处理空元素

4)区分大小写

5)引用的属性值

6)明确的属性值

7) 处理特殊字符<!–10.14更新–>

负边距除了可以进行简单的hack和实现适应浏览器的垂直和水平居中外，更多会用到在流体布局里。

今晚搜索更多相关内容的时候，从这里还学到一种结构多变（左右两栏宽度固定）但排列输出不变的负边距流体布局，我简称神奇流体布局，太神奇了，练习之余总结分享一下。

如下图，无论相关区域在相关区域里怎样滚动变换位置，输出位置都不变，left、main、right区都会分别从左到右排列。

重构也有好玩的东西，好玩之余也可以想想；

这样做的优点：

这样做的缺点：

代码如下（我要看demo），有一个地方想不明白，#in区的负边距可用大于mian宽度但小于1400px的任何整数值。#out区的负边距则可用大于right的任何整数值，为什么呢？继续阅读 →

用position的relative和absolute定位div不方便改动。用float就不折腾了，长宽定义不溢出就行了，float的详细可以看这里，里面的实例更清晰。详细代码和效果如下。

<-点击看大图。

看起来每个div间都有2px距离，因为定义了边框border-width:1px，等同于div外加多一个1px，所以margin、height和width计算时像做小学计算题。以下是代码部分，两个文件放在同一文件夹就行了。