HTML和CSS

1、CSS的定位机制有3种：文档流、浮动（float：left/right/none）和定位 （position:static/relative/absolute/fixed）
2、文档流：将窗体自上而下分成一行行, 并在每行中按从左至右的顺序排放元素
3、position的默认值就是static，relative:相对本身的原始位置发生偏移（left,top），保持文档流。
4、absolute定位：相对于position属性非static值的最近父级元素（参考元素）进行偏移（left,top），同一纬度不同方向都写时（left，right）则拉伸。元素脱离文档流，表现为不会将参考元素撑大，后续文档流中出现在同一个地方的元素，会与该元素重合。实际位置超出参考元素空间的话，是否显示由参考元素overflow控制。
无偏移的绝对定位：如果不写left和top，则脱离文档流后，位置处于它没脱离文档流时的地方，这样不用设置参考元素了，而且不用计算left和top。此时可以用margin（可以是负值）来调整位置。这个在“对齐”需求中非常实用。混合定位:父标签写一个relative,本标签absolute定位，使本标签相对于最近父标签偏移。
5、fixed定位(固定),脱离文档流。相对于浏览器的内容窗口进行偏移（left,top）。8、float元素脱离文档流，表现为不会将父元素撑大，后续文档流中出现在同一个地方的元素，如果是inline元素，会将float元素包围；如果是float元素，则横向顺序排列，排不下则换行；如果是block元素，则重合。5、块级元素(display:block),每个非浮动块级元素都独占一行。默认的宽度为100%，高为0px。当它脱离文档流时，宽度为实际宽度。
6、内联元素(display:inline),

行布局，其表现形式始终以行进行。7、inline-block：对外是内联元素，对内是块级元素。可以设置宽和高，内容不会超出块，即不会出现包围周边内联元素和浮动元素的情况。8、BFC（Block formatting contexts）浮动元素和绝对定位元素，非块级盒子的块级容器（例如 inline-blocks, table-cells, 和 table-captions），以及overflow值不为“visiable”的块级盒子，都会为他们的内容创建新的BFC（块级格式上下文）。 BFC中的元素的布局不受外界的影响，因此不会出现BFC内部元素与外部元素包围于被包围的情况。 除了绝对定位的BFC，其他BFC都会横向避开浮动元素。

因此<div

style="float:left;"/

>
[code]<div

style="overflow:hidden;"

/>可以实现两栏自适应布局。

在一个BFC中，两个相邻的块级盒子的垂直外边距会产生折叠。不同的BFC之间，不会折叠。因此加一个

overflow

:

hidden

可以避免折叠 BFC的高度，会包含它浮动的子元素。因此，加一个

overflow

:

hidden

;

可以消除内部浮动。9、W3C盒模型与IE盒模型的差异10、CSS hack ：针对不同的浏览器写不同的CSS code的过程
11、z-index：仅在设置了position属性的元素上起左右，即设置了position为absolute,fixed或者relative，在static上不起作用。
12、引用优先级：内嵌样式表>导入样式表(@import)>外链样式表
13、选择优先级：id(1,0,0) > class(0,1,0) > 元素(0,0,1),组合选择器的优先级为所包含选择器的和
14、内联样式优先级高于引用样式和选择样式
15、CSS继承：子元素继承父元素的样式，文字相关的会继承，盒模型相关的不会继承
16、WEB标准是一系列标准的集合。网页主要由三部分组成：结构、表现和行为。对应的标准也分三方面：结构化标准语言主要包括XHTML和XML，表现标准语言主要包括CSS，行为标准主要包括DOM、ECMAScript等。这些标准大部分由W3C起草和发布。http://w3help.org/zh-cn/，http://www.w3.org/，http://subject.csdn.net/w3help/