CSS定位
1.定位的定义
CSS中定位用position:static|relative|absolute|fixed来实现
static:1.正常流显示；2.不能通过z-index进行层叠分级；3.可设置width,height；4.设置top,right,bottom,left无效
relative:1.不脱离文档流，参考自身的静态位置，通过top,right,bottom,left进行定位；2.可通过z-index进行层叠分级；3.由于偏移可能会导致宽度、高度错位；建议设置偏移量后，重新设置元素的width,height属性；4.由于元素偏移，会导致后面的内容被覆盖，所以要想正常显示后面的内容，需要将后面内容作为一个层，然后设置这个层的margin-top:上方偏移元素的top值。
absolute:1.脱离文档流，通过top,right,bottom,left定位，它依赖其最近的父级元素定位，当父级position为static时，absolute元素将以body坐标原点进行定位；2.可通过z-index进行层叠分级。
fixed：1.固定定位，其所固定的对象是可视窗口，而并非是body或是父级元素；2.可通过z-index进行层叠分级。
z-index：auto | number；auto 遵从其父对象的定位； number为整数值，可正、负，当然值越大，层元素越靠上。
2.定位的原理
2.1可以位移的元素（相对定位）
在文本流中，任何一个元素都被文本流限制了自身的位置，但通过CSS可以改变这些元素的位置。我们通过float来让元素浮动；通过margin来让元素产生位置移动，但margin并非真实的位移，因为那只是位移的障眼法，而真正意义上的位移是通过top,right,bottom,left针对一个相对定位的元素所产生的。
（图1）
我们看到图1是一个宽度为200px，高度50px，margin:25px；border:25px solid #333; padding:25px;相对定位的元素，并且位移距上50px，距左50px。而下方是一个默认定位的黑色区块，我们看到这个处在文本流的区块被上面的相对定位元素挡住了一部分，这说明：当元素被设置成相对定位或绝对定位后，将自动产生层叠，他们层叠级别自然高于文本流，除非设置z-index值为负值，但在Firefox浏览器中z-index为负值时将不会显示。我们发现当相对定位元素位移后，表现内容已经脱离了文本流，只是在文本流中还为原来的相对定位留下了总宽与总高。这说明在相对定位中，虽然表现区脱离了原来的文本流，但是在文本流中还有此相对定位的老窝。特别注意：1.实际应用中�
相关文档：
第三步是定义你的语言编码，类似这样：
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
为了被浏览器正确解释和通过W3C代码校验，所有的XHTML文档都必须声明它们所使用的编码语言，我们一般使用gb2312(简体中文)，制作多国语言页面也有可能用Unicode、ISO-8859-1等，根据你的� ......
SEO主要就是通过对网站的结构，标签，排版等各方面的优化，使Google等搜索引擎更容易搜索网站的内容，并且让网站的各个网页在GOOGLE等搜索引擎中获得较高的评分，从而获得较好的排名。DIV+CSS网页布局对SEO有哪些影响呢？代码精简使用DIV+CSS布局，页面代码精简，这一点相信对XHTML有所了解的都知道。代码精简所带来的直� ......
在当今网页设计/开发实践中，使用CSS来为语义化的(X)HTML标记添加样式风格是重要的关键。在设计师们的梦想中都存在着这样的一个完美
世界:所有的浏览器都能够理解和适用多有CSS规则，并且呈现相同的视觉效果(没有兼容性问题)。但是，我们并没有生活在这个完美的世界，现实中发生的失
窃却总是恰恰相反，很多CSS样式在 ......
本文为大家收集精选了30个使用纯CSS
完成的强大实践的优秀CSS技术和实例
，您将在这里发现很多与众不同的技术，比如:图片集、阴影效果、可扩展按钮、菜单等…这些实例都是使用纯CSS和HTML实现的。
单击每个实例的标题可以被转向到该技术实例的相关教程或说明页面(英文)，单击每个实例的图片截� ......
宽度自适应的div+css的BOX
参考:
http://space.cnblogs.com/group/topic/3617/
http://www.dynamicdrive.com/style/layouts/item/css-left-and-right-frames-layout/ 一、效果： 二、素材： 三、代码： <style type="text/css">
.box{}
.box .box_tit{position:rela ......
