【转】响应式布局常用的分辨率

类型     布局宽度       列宽   间隙宽度
大屏幕    大于等于1200px     70px   30px
默认       大于等于980px        60px   20px
平板     大于等于768px       42px   20px
手机到平板  小于等于767px       流式列     无固定宽度
手机     小于等于480px       流式列   无固定宽度


/* 大屏幕 */
@media (min-width: 1200px) { ... }

/* 平板电脑和小屏电脑之间的分辨率 */
@media (min-width: 768px) and (max-width: 979px) { ... }

/* 横向放置的手机和竖向放置的平板之间的分辨率 */
@media (max-width: 767px) { ... }


/* 横向放置的手机及分辨率更小的设备 */
@media (max-width: 480px) { ... }

posted @ 2017-08-08 16:25  风间影月  阅读(427)  评论(0编辑  收藏  举报