一,效果图。
二,代码。
![【代码笔记】Web-CSS-CSS Padding(填充) 【代码笔记】Web-CSS-CSS Padding(填充)](https://image.shishitao.com:8440/aHR0cHM6Ly9iYnNtYXguaWthZmFuLmNvbS9zdGF0aWMvTDNCeWIzaDVMMmgwZEhCekwyTnZiVzF2Ymk1amJtSnNiMmR6TG1OdmJTOXBiV0ZuWlhNdlkyOXdlV052WkdVdVoybG0uanBn.jpg?w=700&webp=1)
<!DOCTYPE html>
<html> <head>
<meta charset="utf-8">
<title>CSS padding</title>
<style>
p {
background-color: yellow;
} p.padding {
padding-top: 25px;
padding-bottom: 25px;
padding-right: 50px;
padding-left: 50px;
}
</style>
</head> <body>
<p>This is a paragraph with no specified padding.</p>
<p class="padding">This is a paragraph with specified paddings.</p>
</body> </html>
![【代码笔记】Web-CSS-CSS Padding(填充) 【代码笔记】Web-CSS-CSS Padding(填充)](https://image.shishitao.com:8440/aHR0cHM6Ly9iYnNtYXguaWthZmFuLmNvbS9zdGF0aWMvTDNCeWIzaDVMMmgwZEhCekwyTnZiVzF2Ymk1amJtSnNiMmR6TG1OdmJTOXBiV0ZuWlhNdlkyOXdlV052WkdVdVoybG0uanBn.jpg?w=700&webp=1)
参考资料:《菜鸟教程》