fit-content根据内容自动适应宽度

width:fit-content;可以根据内容不同自动调整自身的宽度,并且随着浏览器的伸缩也不会变形,但是这个属性只能在谷歌浏览器使用。

火狐浏览器需要加上这个属性  width: width: -moz-fit-content;

如下图所示,当页面伸缩时,也会随着浏览器的宽度自适应。此外,如果想让它居住显示,还需要加上属性:margin:auto;

这个样式的实现我是根据flex布局的基础上实现的,有需要的可以尝试。

 

posted @ 2021-06-23 13:21  码磊姐姐  阅读(673)  评论(0)    收藏  举报