边距属性是用来设置页面中一个元素所占空间的边缘到相邻元素之间的距离。 左边距属性(margin-left) 这个属性用来设定左边距的宽度。示例如下:.d1{margin-left:1cm} 示例: HTML HEAD TITLE CSS左边距属性 margin-left /TITLE STYLE type="text/css" .D1{border:1px solid #FF0000;} .D2{border:1px solid gray;} .D3{margin-left:1cm;border:1px solid gray;} /STYLE /HEAD BODY DIV DIV 没有margin /DIV /DIV P 上面两个div没有设置边距属性(margin),仅设置了边框属性(border)。外面那个div的border设为红色,里面那个div的border属性设为灰色。 /P HR P 和上面两个div的CSS属性设置唯一不同的是,下面两个div中,里面的那个div设置了左边距属性(margin-left),表示这个div左边距为1厘米。 /P DIV DIV margin-left设为1cm /DIV /DIV /BODY /HTML 右边距属性(margin-right) 这个属性用来设定右边距的宽度。示例如下:.d1 {margin-right:1cm} 演示示例请参照左边距属性示例,只要将里面的margin-left改成margin-right即可。 上边距属性(margin-top) 这个属性用来设定上边距的宽度。示例如下: .d1 {margin-top:1cm} 演示示例请参照左边距属性示例,只要将里面的margin-left改成margin-top即可。 下边距属性(margin-bottom) 这个属性用来设定下边距的宽度。示例如下:.d1{margin-bottom:1cm} 演示示例请参照左边距属性示例,只要将里面的margin-left改成margin-bottom即可。 边距属性(margin) 这个属性是设定边距宽度的一个快捷的综合写法,用这个属性可以同时设定上下左右边距属性。 你可以为上下左右边距设置相同的宽度。示例入下:.d1 {margin:1cm} 你也可以分别设置边距,顺序是上,右,下,左。示例如下:.d1 {margin:1cm 2cm 3cm 4cm} 上面的代码表示,上边距为1cm,右边距为2cm,下边距为3cm,左边距为4cm。 示例:上下左右边距宽度相同 HTML HEAD TITLE CSS边距属性 margin /TITLE STYLE type="text/css" .D1{border:1px solid #FF0000;} .D2{border:1px solid gray;} .D3{margin:1cm;border:1px solid gray;} /STYLE /HEAD BODY DIV DIV 没有margin /DIV /DIV P 上面两个div没有设置边距属性(margin),仅设置了边框属性(border)。外面那个div的border设为红色,里面那个div的border属性设为灰色。 /P HR P 和上面两个div的CSS属性设置唯一不同的是,下面两个div中,里面的那个div设置了边距属性(margin),边距为1厘米,表示这个div上下左右的边距都为1厘米。 /P DIV DIV margin设为1cm /DIV /DIV /BODY /HTML 示例:上下左右边距宽度各不相同 HTML HEAD TITLE CSS边距属性 margin /TITLE STYLE type="text/css" .D1{border:1px solid #FF0000;} .D2{border:1px solid gray;} .D3{margin:0.5cm 1cm 2.5cm 1.5cm;border:1px solid gray;} /STYLE /HEAD BODY DIV DIV 没有margin /DIV /DIV P 上面两个div没有设置边距属性(margin),仅设置了边框属性(border)。外面那个div的border设为红色,里面那个div的border属性设为灰色。 /P P 和上面两个div的CSS属性设置不同的是,下面两个div中,里面的那个div设置了边距属性(margin),设定上边距为0.5cm,右边距为1cm,下边距为2.5cm,左边距为1.5cm。 /P DIV DIV 上下左右边距宽度各不同 /DIV /DIV /BODY /HTMLhtml教程