边距-层叠样式表
在html页面中使用CSS层叠样式表创建页面边距。
解释
属性
:
保证金所有的边距(顶、右、下、左)使用单个的标记就可以进行设置。用法:
margin: 20px; margin: 10px 20px 30px 10px; margin: 10px 20px; margin: 20px 10px 30px; 定义:
边距可以使用 "margin"标记来设置。
属性可以取以下的值。
a)20px:就是四个边距是20px(顶、右、下、左)。
b)10px 20px 30px 10px:这种格式是按照顺序顶、右、下、左来设置边距。
c)10px 20px:这种格式是设置顶和右边距。 下边距将与上边距相同(10px),左边距与右边距相同(20px)。
d)20px 10px 30px:这种格式是用来设置顶边距、右边距和底边距。左边距与右边距相同。
属性值也可以百分数、点、像素为单位进行设置。
示例1: <div align=right style="
margin: 20px;">
在这里我们设置边距为20像素。
你可以看到页面的四个边都有边距了。
</div>
结果: 在这里我们设置边距为20像素。你可以看到这个段落的四个边都有边距了。
示例2: <div style="
margin: 10px 50px 30px 5px;">
在这里我们设置的边距有四个值。
你就可以看到页面的顶边距10px,右边距50px,底边距30px,左边距5px。
</div>
结果: 在这里我们设置的边距有四个值。你就可以看到页面的顶边距10px,右边距50px,底边距30px,左边距5px。
示例3: <div style="
margin: 20px 40px;">
在这里我们设置的边距有两个值。
你就可以看到顶边距和底边距是20px,左边距和右边距是40px。
</div>
结果: 在这里我们设置的边距有两个值。你就可以看到顶边距和底边距是20px,左边距和右边距是40px。
示例4: <div style="
margin: 10px 50px 40px;">
在这里我们设置的边距有三个值。
你就可以看到页面的顶边距10px,右边距 50px,底边距40px。左边距和右边距相同是50px。
</div>
结果: 在这里我们设置的边距有三个值。你就可以看到页面的顶边距10px,右边距 50px,底边距40px。左边距和右边距相同是50px。