css填充属性padding – CSS教程

上一章CSS教程请查看:css边距属性margin
填充区域是元素内容与其边框之间的空间。
CSS填充属性CSS内边距属性允许你设置将元素的边框与其内容分隔开的内边距区域,填充受框的背景颜色background-color的影响。
为各个边定义填充padding可以使用CSS的各个padding属性轻松地为元素的不同边指定不同的paddings,比如top、right、bottom或left side。

h1 { padding-bottom: 10px; } p { padding-top: 20px; padding-left: 50px; }

填充速记属性padding属性是一个简写属性,用来避免为元素的每边单独设置padding,即:padding-top, padding-right, padding-bottom, padding-left。
h1 { padding: 10px 20px; } p { padding: 10px 15px 20px 25px; }

【css填充属性padding – CSS教程】注意:与CSS边距属性不同,填充属性的值不能为负。与边距属性一样,填充属性的百分比值指的是生成的框的包含块的宽度。
  • 填充属性可以包含一个、两个、三个或四个空白分隔值。
  • 如果设置了一个值,它将应用于所有的四个边。
  • 如果指定了两个值,则第一个值应用于顶部和底部,第二个值应用于右侧和左侧。
  • 如果指定了三个值,第一个值应用于顶部,第二个值应用于左侧和右侧,最后一个值应用于底部。
  • 如果指定了四个值,它们分别按指定的顺序应用于顶部、右侧、底部和左侧。

    推荐阅读