Home > Article > Web Front-end > How to set the top margin in html
How to set the top margin in html
- 青灯夜游Original
- 2021-11-01 17:16:2517219browse
htmlHow to set the top margin: 1. Use the padding-top attribute to set the top padding, the syntax is "padding-top:margin value;"; 2. Use the margin-top attribute to set the top margin, Syntax "margin-top:margin value;".
The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.
htmlSet the top margin
Method 1: Set the top margin
Padding refers to the space between the element border and the element content. We can use the padding-top attribute to set the top padding of an element.
Example:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style type="text/css">
div{
border: 1px solid red;
}
.box{
padding-top: 20px;
}
</style>
</head>
<body>
<div>测试文本</div>
<div>测试文本</div>
</body>
</html>Rendering:
##Method 2: Set top margin
Margin refers to the space around the element. We can use the margin-top attribute to set the top margin of an element. Example:<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style type="text/css">
div{
border: 1px solid red;
}
.box{
margin-top: 20px;
}
</style>
</head>
<body>
<div>测试文本</div>
<div>测试文本</div>
</body>
</html>Rendering:
html video tutorial"
The above is the detailed content of How to set the top margin in html. For more information, please follow other related articles on the PHP Chinese website!