开发者社区> 问答> 正文

css中如何规定某一元素高度等于其宽度

假设我定义某元素的宽度为父元素的50%,而父元素的宽度是可变化的,我想让该元素的高度等于其宽度,如果不用js,要如何实现?

.attr{
  width:50%;
}

展开
收起
杨冬芳 2016-06-02 14:20:04 1986 0
1 条回答
写回答
取消 提交回答
  • IT从业

    可以这样试试

    <style type="text/css">
    #container {
        width: 80%;
        height: 500px;
    }
    
    .attr {
        width: 50%;
        height: 0;
        padding-bottom: 50%;
        background-color: #008b57;
    }
    </style>
    
    
    
    <div id='container'>
        <div class='attr'></div>
    </div>
    2019-07-17 19:24:49
    赞同 展开评论 打赏
问答排行榜
最热
最新

相关电子书

更多
零基础CSS入门教程 立即下载
低代码开发师(初级)实战教程 立即下载
阿里巴巴DevOps 最佳实践手册 立即下载