java中内边距跟外边距,padding和margin——内边距和外边距

一、padding——内边距(内填充)

1.1、padding 简写属性在一个声明中设置所有填充属性。该属性可以有1到4个值。

java中内边距跟外边距,padding和margin——内边距和外边距_第1张图片

div.outer{

width: 400px;

height: 400px;

border: 2px solid #000;

}

div.inner{

width: 200px;

height: 200px;

background-color:red ;

padding: 50px;

}

运行效果图:

java中内边距跟外边距,padding和margin——内边距和外边距_第2张图片

1.2、padding 属性也可以按照方向分开来写。

.outer {

width:400px;

height:400px;

border: 2px solid #000;

}

.inner {

width:200px;

height:200px;

background-color:green;

/*padding:40px 80px;运行效果是一样的*/

padding-top:40px;

padding-right: 80px;

padding-bottom: 40px;

padding-left: 80px;

}

运行效果图:

java中内边距跟外边距,padding和margin——内边距和外边距_第3张图片

1.3、padding属性值可以有四种形式:

java中内边距跟外边距,padding和margin——内边距和外边距_第4张图片

二、margin——外边距

2.1、margin简写属性在一个声明中设置所有外边距属性。该属性可以有1到4个值。

你可能感兴趣的:(java中内边距跟外边距)