自适应开发

简介: 最近准备针对手机做开发,遇到页面显示特别小,所以搞了这么一篇文章! 其实主要就是改掉HTML页面声明: 在网页中加入以下代码,就可以正常显示了:  代码如下:    解释: width - viewport的宽度 height - viewport的高度 init...

最近准备针对手机做开发,遇到页面显示特别小,所以搞了这么一篇文章!


其实主要就是改掉HTML页面声明: 

在网页中加入以下代码,就可以正常显示了: 

代码如下:

<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0"/> 

  

解释: 

width - viewport的宽度 
height - viewport的高度 
initial-scale - 初始的缩放比例 
minimum-scale - 允许用户缩放到的最小比例 
maximum-scale - 允许用户缩放到的最大比例 
user-scalable - 用户是否可以手动缩放 

精简点的话,可以把上面的代码更改为以下代码,效果是一样的: 

代码如下:

<meta content="width=device-width,user-scalable=no" name="viewport"> 

 

最后就是不要设置太大的具体宽度属性了,比如你在网页把Body的宽度属性设为1000px,这肯定是不行的了,但是可以设置为90%,这是屏幕自适应的。 


目录
相关文章
|
开发工具 git
如何在 Git 上删除文件?
如何在 Git 上删除文件?
1079 0
|
开发工具 开发者
使用阿里云的 OpenAPI SDK 时经常遇到调用失败的问题
使用阿里云的 OpenAPI SDK 时经常遇到调用失败的问题
508 1
|
缓存 负载均衡 应用服务中间件
Nginx如何反向代理后端服务?
【7月更文挑战第7天】
465 1
Nginx如何反向代理后端服务?
|
设计模式 缓存 算法
Python设计模式:23种设计模式介绍
设计模式是软件开发中经典的解决问题的方法,包含23种设计模式,它们可以分为三类:创建型模式、结构型模式和行为型模式。
295 1
|
开发框架 JavaScript 前端开发
分享7个.NET开源、功能强大的快速开发框架
分享7个.NET开源、功能强大的快速开发框架
819 1
|
JavaScript 前端开发 开发者
DOMException: 属性设置错误处理指南
DOMException: 属性设置错误处理指南
593 0
|
监控 Java 数据库连接
总结Spring Boot面试知识点
Spring Boot是一个基于Spring框架的开源项目,它简化了Spring应用的初始搭建以及开发过程。通过提供“约定优于配置”的方式,Spring Boot可以帮助开发者快速构建出生产级别的Spring应用。
284 0
|
机器学习/深度学习 Python
【Python机器学习专栏】时间序列数据的特征工程
【4月更文挑战第30天】本文探讨了时间序列数据的特征工程,强调其在捕捉季节性、揭示趋势、处理异常值和提升模型性能中的重要性。介绍了滞后特征、移动窗口统计特征、时间戳特征、频域特征和波动率特征等方法,并提供了Python实现示例。通过有效特征工程,可提高时间序列分析的准确性和预测可靠性。
802 0
|
安全 测试技术 Linux
常见安全测试工具
常见安全测试工具
462 1
|
Java 测试技术 Maven
boot项目添加运行参数的maven插件
boot项目添加运行参数的maven插件
214 0