css margin-bottom设置HTML元素之间底(下)边距离

时间:2016-07-24
css margin-bottom属性用于设置html元素底边的外延边距,该属性的值允许是负值,本文章向大家介绍margin-bottom的使用语法以及使用实例,需要的朋友可以参考一下。

css margin-bottom介绍

css margin-bottom用于设置HTML元素之间的下边距,即某一个HTML元素的下边与下一个html元素上边的距离。

注意行内元素是无法设置margin-bottom属性的。

语法:

margin-bottom:值(如10px);

如:

margin-bottom:10px;

表示表示设置该对象下边距离与下一个对象盒子距离为10像素

margin-bottom取值

margin-bottom的取值可以设置以下四种情况:

描述
auto 浏览器计算下外边距。
length 规定以具体单位计的下外边距值,比如像素、厘米等。默认值是 0px。
% 规定基于父元素的宽度的百分比的下外边距。
inherit 规定应该从父元素继承下外边距。

一般网站开发中,我们建议大家使用像素px作为margin-bottom的单位。

margin-bottom实例

设置一个class为ex1的p元素的下边距与下一个HTML元素的上边距为2cm

<!DOCTYPE html>
<html>
<head>
<title>http://www.manongjc.com/article/1262.html</title>
<style>
p.ex1 {margin-bottom:2cm}
</style>
</head>
<body>
<p>A paragraph with no margins specified.</p>
<p class="ex1">A paragraph with a 2cm bottom margin.</p>
<p>A paragraph with no margins specified.</p>
</body>
</html>

在线运行