css中自适应样式（自媒体）

一般自适应调节，我会分为几种分辨率来进行定义
1.
@media only screen and (max-width:1440px){
要调节的元素
#resultBox {
width:100%;
}
}
2.
@media only screen and (max-width:1024px){
要调节的元素
#resultBox {
width:80%;
}
}
3.
@media only screen and (max-width:768px){
要调节的元素
#resultBox {
width:76%;
}
}
4.
@media only screen and (max-width:640px){
要调节的元素
#resultBox {
width:60%;
}
}
5.
@media only screen and (max-width:480px){
要调节的元素
#resultBox {
width:50%;
}
}
6.
@media only screen and (max-width:320px){
要调节的元素
#resultBox {
width:30%;
}
}