本文主要是介绍网站开发进阶(四十七)html中padding-top与margin-top的区别,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
一、前言
padding-top
:10px;是指容器内的内容距离容器的顶部有10个像素,是包含在容器内的;margin-top
:10px;是指容器本身的顶部距离其他容器有10个像素,不饱含在容器内。
就像墙上挂着的两个相框,margin
指的是相框与相框的距离,padding
指的是每个相框里照片与相框边框的距离。
二、代码示例
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title> new document </title><meta name="generator" content="editplus" /><meta name="author" content="" /><meta name="keywords" content="" /><meta name="description" content="" /><style type="text/css">
body
{padding: 0px;margin: 0px;
}</style>
</head><body><input type="text" value="margin: 50px;" /><div style="margin: 20px; padding: 50px;background-color: yellow;"><div style="background-color: green;">margin: 20px; padding: 50px;</div></div><input type="text" value="margin: 50px;" />
</body>
</html>
这篇关于网站开发进阶(四十七)html中padding-top与margin-top的区别的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!