外边距Margin

来源：互联网发布：飞机晚点软件编辑：程序博客网时间：2024/06/06 01:15

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
*{
padding: 0;
margin: 0;
}
/*标签选择器*/
div{
height: 300px;
background-color: yellow;
/*margin: 20px; /!*上右下左用同一个数据*!/*/
/*margin: 40px 40px;/!*上下左右*!/*/
/*margin: 50px 80px 20px; /!*上左右下*!/*/
/*margin: 50px 80px 40px 20px; /!*上右下左*!/*/
margin: 40px 40px;
text-align: justify;
/*margin: 0px auto; /!*自动居中*!/*/
/*border: 5px solid red;*/
border-left: 20px groove blue;
border-right:20px double red;
border-top:20px dashed green;
border-bottom:20px dotted darkmagenta;
padding-top: 40px;
padding-bottom: 40px;
padding-left: 40px;
padding-right: 40px;
}
p{
background-color: red;
height: 200px;
}
</style>
<title>外边距Margin</title>
</head>
<body>
<div>
杰瑞教育杰瑞教育杰瑞教育杰瑞教育杰瑞教育杰瑞教育杰瑞教育杰瑞教育杰瑞教育
杰瑞教育杰瑞教育杰瑞教育杰瑞教育杰瑞教育杰瑞教育杰瑞教育杰瑞教育杰瑞教育
杰瑞教育杰瑞教育杰瑞教育杰瑞教育杰瑞教育杰瑞教育杰瑞教育杰瑞教育杰瑞教育
杰瑞教育杰瑞教育杰瑞教育杰瑞教育杰瑞教育杰瑞教育杰瑞教育杰瑞教育杰瑞教育
杰瑞教育杰瑞教育杰瑞教育杰瑞教育杰瑞教育杰瑞教育杰瑞教育杰瑞教育杰瑞教育
杰瑞教育杰瑞教育杰瑞教育杰瑞教育杰瑞教育杰瑞教育杰瑞教育杰瑞教育杰瑞教育
</div>
<p>
杰瑞教育2
</p>
</body>
</html>

0 0