样式表规定了一个容器BOX,它将要储存一个对象的所有可操作的样式。包括了对象本身、边框空白、对象边框、对象间隙四个方面。
为了大家更好地理解这些属性的意义,以及互相之间的关系,请看下面这个图示:

| ·margin-right:右边空白距离 ·margin-bottom:底部空白距离 ·margin-left:左边空白距离 p { margin: 2em 4em } /* 上和下边界为2em,左和右边界为4em */ div { margin: 1em 2em 3em 4em } /* 上边界为1em,右边界为2em,下边界为3em,左边界为4em */ body { margin-top: 0 } /*消除文件的上边界*/ P.narrow { margin-right: 50% } DT { margin-bottom: 3em } 如果边界在垂直方向邻接(重叠)了,会改用其中最大的那个边界值。而水平方向则不会。 |
| ·padding-right 右边补白 ·padding-bottom 底部补白 ·padding-left 左边补白 bc { padding: 1em 2em 3em 4em } /* 上、右、下、左分别为 */ bc { padding: 2em 4em 5em } /* 上补白2,右补白4em,下补白5em,左补白4em */ bc { padding: 2em 4em } /* 上下为2em,左右为4em */ bc { padding: 2em} /* 上、右、下、左均为2em */ |
语法:{border-color:数值 数值 数值 数值}
说明:数值分别代表top、right、bottom、left颜色值
·hidden 隐藏边框
·inherit 继承父边框
·dashed 边框为长短线
·dotted 边框为点线
·solid 边框为实线
·double 边框为双线
·inset 根据color属性显示不同效果的3D边框
·outset 根据color属性显示不同效果的3D边框
·ridge 根据color属性显示不同效果的3D边框
·groove 根据color属性显示不同效果的3D边框
·border-color:边框颜色
·border-style:边框样式参数
·left 将其它元素内容放到浮动元素右边。
·right 将其它元素内容放到浮动元素左边。漂浮属性允许网页制作者将文本环绕在一个元素的周围. 这同HTML 3.2中IMG元素的ALIGN=left和ALIGN=right一样,但CSS1允许所有对象“漂浮”,而不像HTML 3.2那样仅仅允许图象和表格。
·right 将元素放在右边浮动元素下面
·both 元素两边都不允许放置浮动元素