在这个关于CSS和HTML中的边距和内边距的入门教程中，我们将探索一些易于使用的创造性应用程序，进一步增强你在元素周围添加空间的能力。您可能想要在图像周围添加空格，或者在网页边框和正在显示的文本之间扩展空格。
此外，我们将探讨不同级别的间距，并真正了解CSS中边缘和填充之间的差异。在此领域内，我们还将探索许多自定义选项，您必须使用精确测量设置边距和填充。
边距和填充之间的区别
利润率
边缘控制网页边缘和元素本身之间的间距宽度。
以下是四个属性选项：
- 边缘
- 边缘右边
- 边缘底部
- 边缘左边
的保证金语法选项是:
- 边缘 - 顶部：<长度> |<百分比>
- 边缘 - 右：<长度> |<百分比>
- margin-bottom: <长度> | <百分比>
- 边缘左：<长度> |<百分比>
填充
填充控制在元素周围的区域。
以下是四种属性选项:
- 填充顶部
- padding-right
- 填充底部
- 填充填充
的填充语法选项是:
- padding-top: <长度> | <百分比>
- padding-right:
| - padding-bottom: <长度> | <百分比>
- 填充左：<长度> |<百分比>
为了更好地理解元素周围的内边距和边距的准确位置，我们可以考虑框图。
利润率在外面。想想你在一张纸上使用的边缘。这些边缘远离纸张边缘。在HTML边缘中的工作方式与页面边缘的空间相同。
边界只需封装元素。边框可以立即包围元素，或者如果对元素应用了更多的填充，它可能会远离元素。
填充提供元素周围的空间。想想在冬天穿着较重的夹克。夹克越厚，你周围的衬垫越多。在这种情况下，在这种情况下，是元素。
定义边距和填充
使用像素中的数值
我们如何计算像素?显示分辨率表示屏幕中包含多少像素。例如，1080×1920显示只是一个1080像素高、1920像素宽的网格。在你的网页上。当我们进入添加像素尺寸，你会想玩不同的数值来调整结果，以适应你的需要。
在以下代码中图像属性，我们设置了：
- 图像的宽度到300px.
- 边境到2px.
- 填充到0px.
- 利润到0px.
web输出如下所示:
如果我们增加填充，我们会看到边框离图像更远，因为padding属性是第一个包装元素的。
|
