网站制作前端代码中的padding和margin有什么区别

2022-02-14 分类：网站制作

不同于十几年前用table进行网页布局，现在网站制作基本上基于div+css，margin和padding作为两大基本元素块，会被经常使用到。作为一名网站设计师或者网站前端工程师，如果你仍旧不太清楚padding和margin之间的区别，这并不稀奇。这是一个常见的问题，已经困扰了许多网站建设工作人员。这也是我们写作本文的目的，通过简单的示范和讲解，让你明白网站制作前端代码中的padding和margin有什么区别，以及如何区分和使用两者。

了解差异

Margin和padding可能会混淆新手的网页设计师，有时甚至是更有经验的网站制作前端工程师。毕竟，在某些方面，它们看起来是一样的：图像或物体周围的Margin。

插图演示和padding、边框和边距的插图

padding仅仅是边界和实际图像或单元格内容之间的边界内的空间。在图像中，padding是内容周围的黄色区域。请注意，padding完全围绕着内容。你会发现padding在顶部，底部，右侧和左侧。另一方面，边距是边界之外、边界和此对象旁边的其他元素之间的空间。在图像中，边距是整个对象外部的WIE区域。请注意，与padding一样，页边距完全围绕内容。顶部、底部、右侧和左侧有边距。

特别注意

请记住，如果您计划使用边距和padding功能来实现真正的高级功能，则需要注意某些浏览器(如Internet Explorer)没有正确地实现Box模型。这意味着您的页面在其他浏览器中看起来会不同(有时会非常不同)。

分享名称：网站制作前端代码中的padding和margin有什么区别
本文网址：https://www.cdcxhl.com/news/143821.html

网站建设、网络推广公司-创新互联，是专注品牌与效果的网站制作，网络营销seo公司；服务项目有网站制作等

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源：创新互联

猜你还喜欢下面的内容