2025-1-20-盒子模型-弹性盒子模型

重新学一下巩固，之前发的看不了，本来还想着直接看呢

盒子模型
width，height是宽高，padding是内边距，如果里边有文本的话一般是贴着左上方，但是有内边距就不会，类似下边的演示图；border是内外之间边框，就是给宽高之外加一层；margin是外边距，可以理解为是你构造的边框距离这个页面的距离

div{
width:100px;
height:100px;
background-color:red;
padding:50px 10px;
/第一个值为上下间距，第二个值为左右间距
也可以用left，right，top，bottom来分开写/
border:5px solid blue;/第一个值为边框宽度，第二个值为边框颜色/
margin:50px 10px;
/第一个值为上下间距，第二个值为左右间距
也可以用left，right，top，bottom来分开写/
}

演示

这张图片是梗概

弹性盒子模型

父级属性
弹性盒子默认水平摆放，更改摆放方式的属性

垂直方向上的上下中摆放

水平方向上的上下中摆放

子元素属性
flex，按照权重给予相应宽度的变化，生效时width属性不生效