首页 > 代码库 > 纯css实现宽度自适应，高度与宽度成比例

纯css实现宽度自适应，高度与宽度成比例

2024-09-26 04:44:02   212人阅读

html：

 <div></div>

css

div{
    width: 33.33%;
    box-sizing: border-box;
    float: left;
    position: relative;
}
div::before{
    content: "";
    padding-top: 100%;  /*关键代码*/
    display: block;
}

 

纯css实现宽度自适应，高度与宽度成比例


联系
我们