首页 > 代码库 > 响应式布局(css3、html5)流程
响应式布局(css3、html5)流程
第一步:确定需要兼容的设备类型、屏幕尺寸
设备类型:包括移动设备(手机、平板)和pc。对于移动设备,设计和实现的时候注意增加手势的功能。
屏幕尺寸:包括各种手机屏幕的尺寸(包括横向和竖向)、各种平板的尺寸(包括横向和竖向)、普通电脑屏幕和宽屏。
第二步:实施过程
1. 设置 Meta 标签
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
2.设置不同屏幕的样式表
@media screen and (min-width: ?) and (max-width : ?x),这个条件语句意思是在大于?0小于? 的分辨率下所激活的样式表。
响应式布局(css3、html5)流程
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。