首页 > 其他分享 >CSS - 设置内边距padding,复合写法,内边距会影响盒子大小的问题

CSS - 设置内边距padding,复合写法,内边距会影响盒子大小的问题

时间:2023-01-05 13:57:22浏览次数:45  
标签:盒子 距会 padding 内边 设置 4px

1.设置内边距

/*设置上内边距*/
padding-top: 20px;

/*设置下内边距*/
padding-bottom: 20px;

/*设置左内边距*/
padding-left: 20px;

/*设置右内边距*/
padding-right: 20px;

属性值可以为:auto,px,% 规定基于父元素的高宽度的百分比的内边距

 

2.复合写法

/*设置上下左右内边距*/
padding: 4px;

/*设置上下内边距 左右内边距*/
padding: 4px 4px;

/*设置上内边距 左右内边距 下内边距*/
padding: 4px 2px 4px;

/*设置上内边距 下内边距 左内边距 右内边距*/
padding: 4px 4px 4px 4px;

 

3.设置内边距会影响盒子实际大小的问题

盒子设置了宽度和高度时,设置内边距会影响盒子实际的大小

盒子没有设置宽度与高度时,设置内边距不会影响盒子实际的大小

 

标签:盒子,距会,padding,内边,设置,4px
From: https://www.cnblogs.com/ErenYeager/p/17027326.html

相关文章