如果一個div的寬度用百分比表示，怎樣讓這個div的高度=寬度

今天寫東西遇到了這樣一個問題，一個div的寬度不固定，設置成20%，現在想讓這個div變成正方形，高度也設置成20%,不管用！

最后尋找各種方法嘗試

方法一：

<div class="circle"> 

</div>

.circle{width: 20%;
padding-top: 100%;
}，因為當一個div的高度沒有時，它的padding值設百分數的話，就依據寬度來定，所以padding-top: 100%;就是寬度的值；這樣高=寬。

這種方法有一個問題就是div里邊的內容就要用絕對定位來寫了。

方法二：

可以用js來實現。

//用jQuery
var w=$('.circle').width();
$('.circle').attr('height',w);

//用原生js

var w=document.getElementById("circle").style.width;
document.getElementById("circle").style.height=
document.getElementById("circle").offsetWidth+"px";