这篇文章是我不懂css的时候收藏的，分享给大家。
1、当需要定宽和浮动时在最外层设定，此层不能padding,可以margin.
2、最外层同时左浮动会造成IE6的双倍边界，必须加display:inline来解决.
3、子层不允许设定宽度，全部通过Padding(左右)来定宽
4、Div默认宽100%,高0px. 宽和高的优先级大于父级的padding
5.ui的magin会有一定的值.一般采用magin:0,一般用padding来定义.
6.form会产生一定的边距.需设magin:0;
7.图片会自动撑大外套div，因此，图片样式需设display:block;但当图片和文字并排会独占一行，需一行时设图片样式display:inline，
8. 在ie6,firefox中不定义高度会自适应高度.
9.当父元素定义宽时，子元素设有margin时，在ie８中出现上下没margin，此时给父元素设border会好.
7.清空.clear ie６会产生一定的间隙，要设.clear{overflow:hidden};
8.div发生错位，一般用清除浮动来解决。
9.div的height：100%。在有父级层时会起作用。
10.文本框，文字，图片对齐。vertical-align:middle;对块元素不起作用.因此，要用ul li{disploy:inline;line-height:20px;}input,img{vertical-align:middle; }这样会在一条直线上。
11.表格文字自动换行word-wrap:break-word; overflow:hidden;
12.链接时图片出现边框 a:img{
text-decoration:none;
boder:none;
}
13.
.color{
background-color: #CC00FF;
background-color: #FF0000\9; /
*background-color: #0066FF;
_background-color: #009933; /*IE6会变为绿色*
}
————–
2.百分比值的使用
在使用百分比时，这个值不是用元素自身的宽度值来计算的。而是用包含元素的父元素的宽度来计算的。
在firework中p元素含有的边界较大
3.边界属性
水平auto 在水平方向上，非浮动块元素盒模型的各个部分宽度之和。等于父元素的宽度。这个原则下，auto值就是填补父元素宽度的默认值。eg.如果父元素的宽度为450像素，子元素的宽度为200像素，左右补白属性都为50像素，没有边框。此时，定义子元素的margin为auto。那么auto的值就为75像素。
4.垂直方向的边界重叠。
两个带有margin属性的元素相邻时，在垂直方向上，边界属性会发生重叠。不相等时，元素间的距离等于值较大的一个。
5.在内联歹毒中使用边界属性
inline在水平位置上跟块元素一 样，产生作用，在垂直位置不变化。
6.子元素边界属性为0时
父元素含有有padding属性，子元素margin为零时。边界由父的padding决定；
当父的padding为零时，由子的margin来决定，但在firework中会起在父的作用上，给父添加1像素的边框会正常；
父元素含有padding属性同时子元素含有margin属性。
在ie浏览器中，在垂直方向上，采用父元素的补白属性值与子元素边界属性值重叠的方式，确定两者之间的距离。在水平方向上，采用相加的距离。在firework中，垂直和水平都采用相加。
浮动元素的双边距和零边距问题
方案1.不使用浮动元素的magin属性来定位 ，而采用父元素的padding来定位 。可解决双边距和零边距问题；
方案2.采用浮动元素的magin属性值为需要值 的一半，但是要使用!important声明，使firework中原来的边距。同使用附加的div的方法清除浮动；
方案3.使用定义浮动元素为内联元素的方法。这种方法并不能解决0边距的问题，依然要使用附加的div方法来清除浮动。
嵌套元素宽度和高度叠加的问题（父padding 子magin）
1.父元素和子元素没有定义宽度和高度时，上下左右都采用了叠加
2.定义子元素的宽后ie6在左右上下采用了叠加，而firefox都采用了相加；
3.定义父元素的宽后，ie6中上边界相叠加，下边界相加。firefox采用了相加的方式。
解决方案：用单独的空白分隔父元素与子元素的。定义宽度后，交用magin灵活一些，但在firework中。在父元素加个1px边框。
8.div发生错位，一般用清除浮动来解决。
9.div的height：100%。在有父级层时会起作用。
10.文本框，文字，图片对齐。vertical-align:middle;对块元素不起作用.因此，要用ul li{disploy:inline;line-height:20px;}input,img{vertical-align:middle; }这样会在一条直线上。
11.表格文字自动换行word-wrap:break-word; overflow:hidden;
12.链接时图片出现边框 a:img{
text-decoration:none;
boder:none;
}
13.
.color{
background-color: #CC00FF;
background-color: #FF0000\9; /
*background-color: #0066FF;
_background-color: #009933;
}
————–
2.百分比值的使用
在使用百分比时，这个值不是用元素自身的宽度值来计算的。而是用包含元素的父元素的宽度来计算的。
在firework中p元素含有的边界较大
3.边界属性
水平auto
4.垂直方向的边界重叠。
两个带有margin属性的元素相邻时，在垂直方向上，边界属性会发生重叠。不相等时，元素间的距离等于值较大的一个。
5.在内联歹毒中使用边界属性
inline在水平位置上跟块元素一 样，产生作用，在垂直位置不变化。
6.子元素边界属性为0时
父元素含有有padding属性，子元素margin为零时。边界由父的padding决定；
当父的padding为零时，由子的margin来决定，但在firework中会起在父的作用上，给父添加1像素的边框会正常；
父元素含有padding属性同时子元素含有margin属性。
在ie浏览器中，在垂直方向上，采用父元素的补白属性值与子元素边界属性值重叠的方式，确定两者之间的距离。在水平方向上，采用相加的距离。在firework中，垂直和水平都采用相加。
浮动元素的双边距和零边距问题
方案1.不使用浮动元素的magin属性来定位 ，而采用父元素的padding来定位 。可解决双边距和零边距问题；
方案2.采用浮动元素的magin属性值为需要值 的一半，但是要使用!important声明，使firework中原来的边距。同使用附加的div的方法清除浮动；
方案3.使用定义浮动元素为内联元素的方法。这种方法并不能解决0边距的问题，依然要使用附加的div方法来清除浮动。
嵌套元素宽度和高度叠加的问题（父padding 子magin）
1.父元素和子元素没有定义宽度和高度时，上下左右都采用了叠加
2.定义子元素的宽后ie6在左右上下采用了叠加，而firefox都采用了相加；
3.定义父元素的宽后，ie6中上边界相叠加，下边界相加。firefox采用了相加的方式。
解决方案：用单独的空白分隔父元素与子元素的。定义宽度后，交用magin灵活一些，但在firework中。在父元素加个1px边框。