@media only screen and (min-width: 100px) and (max-width: 640px) {
div{
width: 100px;
height: 100px;
}
}
@media only screen and (min-width: 641px) and (max-width: 789px) {
div{
width: 200px;
height: 200px;
}
}
2.方案二:百分比來做,這裏需要運用壹個小技巧,padding用百分比做單位時是相對於容器的寬度來算的,所以妳可以把高度設為0,內容自然溢出,設置個padding-bottom
height:0;
width:50%;
padding-bottom:30%
那麽這個div的高寬比就是30%:50%