css手机端和电脑端适配

前言

一般网站实现pc端与移动端适配的需求，方案有两个：
1、一套页面，从设计时就考虑到跨设备适配，响应式的一步到位；
2、开发两套页面，根据设备尺寸加载加载不同的资源，目前已经不常见了；

CSS代码

/*手机端*/
@media screen and (max-width: 768px) {
    .div {
        margin:10px;
    }
}
/*PC端*/
@media screen and (min-width: 769px) {
    .div {
        margin:30px;
    }
}