因为设置了display: flex; 导致block布局变成了flex布局, 所以在子元素宽度没有被撑破的情况下,子元素宽度是有效的,但是当子元素内容过多,此时宽度会比实际宽度小,所以如果想要在已经设置了flex布局的基础上,再进行子元素宽度的设置,可以应用下面的样式:(在该子元素上设置)
width: 120px;
flex-shrink: 0;
flex-grow;此属性为是否自动增长空间,
flex-shrink;此属性为是否自动缩小空间,
默认值都是1,即自动增长/缩小,设置为0时,不会自动增长/缩小