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

发表于   |   分类于 ， ，

使用js实现

<script type="text/javascript">
    $(document).ready(function(){
    $('#box1').css('height',$('#box1').css('width'));
})
</script>
<style type="text/css">
#box{
    width: 900px;
    height: 400px;
    border:1px solid red;
}
#box1{
    width:50%;
    border:1px solid green;
}
</style>
<body>
<div id='box'>
<div id='box1'></div>
</div>
</body>

Ps:如果还有其他实现方式，请留言，谢谢。