css box model

标签：box color padding radius 5px model border css

 

 

 

 

HTML：

 

 css:

 

 效果：

 

一起设置：

 border:width style color;

exaple:    border:medium dashed green;

 

border-radius可以把四周钝化：

 

 

 

 padding:

文字和外框间的距离

button{     background-color: rgb(161, 161, 214);     padding: 5px 10px 5px 10px;     border-radius: 5px; } 这里是click和外框的距离

 

 

margin

外框和边界的距离。这里黄色框比其他没有设置margin的框要离边界远一些。

 

 

#three{     background-color: gold;     border-radius: 10%;     border-color:(236, 183, 191);     padding:20px;     margin: 20px; }   display: 改变展现方式。比如div本来是占一行的，但是设置后可以变成占一个小格子或者横向排列 div {     width: 100px;     height: 100px;     display:inline-block;
}

 

 

 

 

标签：box,color,padding,radius,5px,model,border,css
From： https://www.cnblogs.com/doudou666/p/16714093.html