本篇文章主要介绍了ionic2屏幕适配实现适配手机、平板等设备的示例代码，具有一定的参考价值，感兴趣的小伙伴们可以参考一下。
本文介绍了ionic2屏幕适配实现适配手机、平板等设备的示例代码，分享给大家，具体如下：
推荐使用的编辑器是：VS code （Visual Studio Code）=>只负责编辑文档，不编译。
而WebStorm 有检查编译等，在ionic1开发的时候，还很方便用浏览器随时点击按键浏览效果，但是开发ionic2之后，ionic2有自动检查编译，会照成webstorm卡顿，无法编辑。
一、首先增加一个一面作为测试
我使用的工程是sidemenu
在项目目录下执行如下命令: ionic g page page4
二、运行 命令打开浏览器调试
SuperCms在线订餐系统
下载
模板采用响应式设计，自动适应手机，电脑及平板显示；满足单一店铺外卖需求。功能：1.菜单分类管理2.菜品管理：菜品增加，删除，修改3.订单管理4.友情链接管理5.数据库备份6.文章模块：如：促销活动，帮助中心7.单页模块：如：企业信息，关于我们更强大的功能在开发中……安装方法：上传到网站根目录，运行http://www.***.com/install 自动
Ionic serve
三、修改page4.html文件的内容如下：
title card content content
其实这里参考的地方是，
四、测试效果：
用鼠标拉动浏览器边框调整页面大小，会发展ionic的页面元素也会跟着动态大小变形。当这个软件编译到了平台安装包。比如编译了Android，那么页面会自适应android的屏幕。实现了对不同屏幕大小的设备适配。
