margin和padding属性详解

最新推荐文章于 2024-05-10 09:57:10 发布

Zzze0101

最新推荐文章于 2024-05-10 09:57:10 发布

阅读量3.3k

点赞数 3

分类专栏： css 文章标签： margin padding

本文链接：https://blog.csdn.net/Zzze0101/article/details/90399731

版权

margin

围绕在元素边框的空白区域是外边距。设置外边距会在元素外创建额外的“空白”。
margin样式属性用于在一个声明中设置所有外边距的宽度，或者设置各边上外边距的宽度。该属性有多个值：

值	描述
auto	浏览器计算外边距。
length	规定以具体单位计的外边距值，比如像素、厘米等。默认值是 0px。注：允许使用负值，不过要谨慎使用。
%	规定基于父元素的宽度的百分比的外边距。

1、length

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>margin-top</title>
		<style type="text/css">
			div {
    
				border: 1px solid black;
			}
			.one{
    
				margin: 30px;
			}
			.two{
    
				margin: 20px 40px;
			}
			.three{
    
				margin: 40px 20px 30px ;
			}
			.four {
    
				margin: 10px 30px 60px 150px;
			}
		</style>
	</head>

	<body>
		<div class="one">第一个div,四个边框均为30像素</div>
		<div class="two">第二个div,上下边框为20像素，左右边框为40像素</div>
		<div class="three">第三个div，上边框40像素，下边框30像素，左右边框20像素</div>
		<div class="four">第四个

最低0.47元/天解锁文章

Zzze0101

关注

3
点赞
踩
14

收藏

觉得还不错? 一键收藏
0
评论
margin和padding属性详解

margin围绕在元素边框的空白区域是外边距。设置外边距会在元素外创建额外的“空白”。margin样式属性用于在一个声明中设置所有外边距的宽度，或者设置各边上外边距的宽度。该属性有多个值：值描述auto浏览器计算外边距。length规定以具体单位计的外边距值，比如像素、厘米等。默认值是 0px。注：允许使用负值，不过要谨慎使用。%规定基于父元素的宽度的百...
复制链接

扫一扫

专栏目录