php如何将页面嵌入在另一盒子里,CSS盒子嵌套

实例

html>

一个css盒子模型

.h1{

background-color: darkblue;

font-size: 30px 黑体;

color: red;

}

.box1{

background-color: blueviolet;

width:400px;

height:400px;

padding:30px 20px 40px 20px;

border:2px solid red;

margin: 50px;

}

.box2{

background-color: lime;

/*inherit为继承的意思，继承父盒子的数值，也可以自己编写.*/

width:inherit ;

height: inherit;

/*padding:20px 30px;子盒子设置的padding和margin是相对于父盒子的*/

/*padding:20px 30px;*/

/*padding,margin:简写方向为 上右下左(顺时针方向)。只有两个数字为上下和左右。*/

border: 2px dotted red;

/*margin: 5px;*/

/*注: padding,margin 只允许设置宽度, 不允许设置样式与颜色*/

}

下边是两个嵌套的盒子

这里是盒子2继承盒子1的高度和宽度，未设置子盒子外边距和内边距

/*注: padding,margin 只允许设置宽度, 不允许设置样式与颜色*/

/*padding,margin:简写方向为 上右下左(顺时针方向)。只有两个数字为上下和左右。*/

运行实例 »

点击 "运行实例" 按钮查看在线实例