//大屏幕設(shè)備

        @media (max-width:1200px) {

.div1,.div2,.div3{width: 33%;}

.div1,.div2,.div3{height: 600px;

}

        //電腦屏幕設(shè)備

@media (max-width:992px) {

.div1,.div2,.div3{width: 50%;}

.div1,.div2,.div3{height: 400px;

}

         //手機平板屏幕設(shè)備

@media (max-width:768px) {

.div1,.div2,.div3{width: 50%;}

.div1,.div2,.div3{height: 200px;

}

        //小型舊版iphone4屏幕設(shè)備

@media (max-width:374px) {

.div1,.div2,.div3{width: 100%;}

.div1,.div2,.div3{height: 100px;

}

第二種:

@media (min-width:374px) {

.div1,.div2,.div3{width: 100%;}

.div1,.div2,.div3{height: 100px;

}

@media (min-width:768px) {

.div1,.div2,.div3{width: 50%;}

.div1,.div2,.div3{height: 200px;

}

@media (min-width:992px) {

.div1,.div2,.div3{width: 50%;}

.div1,.div2,.div3{height: 400px;

}

@media (min-width:1200px) {

.div1,.div2,.div3{width: 33%;}

.div1,.div2,.div3{height: 600px;

}