如何用纯css写一宽为30%的正方形，用到了padding属性；
会不会恍然大悟呢？
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
/*div{
background: #c6c;
margin: 0;
padding-bottom: 30%;
}*/
/*div{
background: #c6c;
margin: 0;
padding: 15% 0;
}*/
#dd::after{
content: "";
display: block;
padding-top: 100%;
} </style>
</head>
<body>
<div style="width:30%; background:red;" id="dd"></div> </body>
</html>
7-11为法一
12-16为法二