内边距padding的css样式

*{
   margin: 0;
   padding: 0;
}

/*padding第一种解决方案*/

#box1{
   width: 300px;
   height: 300px;
   border: 1px solid #ff0000;
}
#box2{
   width: 200px;
   height: 200px;
   background: yellow;
}
#box1{
   padding: 50px;
   width: 200px;
   height: 200px;
}
/*padding第二种解决方案*/
#box{
   width: 300px;
}

#box3{
   padding: 50px;
   border: 1px solid #ff0000;
}
#box4{
   width: 200px;
   height: 200px;
   background: yellow;
}


/*padding第3种解决方案*/

#box5{
   width: 300px;
   height: 300px;
   padding: 50px;
   border: 1px solid #ff0000;
   box-sizing: border-box;
}
#box6{
   width: 200px;
   height: 200px;
   background: yellow;
}