CSS padding(内边距)属性设置及简介说明


摘要:
下文讲述css中设置内边距的方法分享,如下所示:


css padding简介

在html编码的世界中,我们可以通过使用Padding设置内边距的方式,使元素离内部边框产生一定的距离,如下所示:

实现思路:
通过设置padding属性或
单边内边距
padding-top —上内边距
padding-bottom —下内边距
padding-right —右内边距
padding-left —左内边距
属性
—-这些属性值我们可以放入
auto
length(px pt em等浏览器支持的长度单位)
百分比%
—————–注意事项—————
padding可以快速简写输入外边距
例:
————————————–
padding:25px 50px 75px 100px;
上填充为25px
右填充为50px
下填充为75px
左填充为100px
————————————–
padding:25px 50px 75px;
上填充为25px
左右填充为50px
下填充为75px
————————————–
padding:25px 50px;
上下填充为25px
左右填充为50px
————————————–
padding:25px;
所有的填充都是25px

例:
设置 元素的内边距

  <html>
<head>
<meta charset="utf-8"> 
<title>猫猫教程(maomao365.com)--设置元素内边距</title> 
<style>
p
{
	background-color:blue;
}
p.padding
{
	padding:25px 50px;
    /*上下填充为25px
      左右填充为50px
    */
}
</style>
</head>

<body>

<p>无内边距的元素</p>
<p class="padding">上下填充为25px
      左右填充为50px</p>

</body>
</html>