如何让我的网页完美适配任何智能手机？
约翰尼
请用您的智能手机查看链接，您可以看到它有点关闭。我把所有东西都居中，网络在桌面上看起来很好，但在智能手机中不是（我使用 iPhone 5S）。有什么方法可以使它像任何类型的智能手机的桌面一样吗？有什么方法可以让它看起来像 Gmail 应用程序，你不能到处滚动？
我已经完成了所有调整，如 head 标签中的以下代码。但它不起作用。如果您需要在桌面上查找，这是 url：https : //johnny00520.github.io/Test.git.io/
非常感谢。
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">
<title>MindScribe</title>
<!--<meta name="description" content="An interactive getting started guide for Brackets.">-->
<!-- Maybe I need. Note that Android and iOS ignore media="handheld"-->
<link rel="stylesheet" media="handheld, only screen and (max-device-width: 320px)" href="phone.css">
<link rel="stylesheet" media="only screen and (min-width: 641px) and (max-width: 800px)" href="ipad.css">
<!-- media="handheld" trick for Windows Mobile -->
<link rel="stylesheet" href="screen.css" media="Screen">
<link rel="stylesheet" href="mobile.css" media="handheld">
<!--smartphone conpatible-->
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=yes" />
<!-- Home screen icon -->
<link rel="apple-touch-icon" href="/static/images/identity/HTML5_Badge_64.png" />
<link rel="apple-touch-icon-precomposed" href="/static/images/identity/HTML5_Badge_64.png" />
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<link rel="stylesheet" href="css/main.css">
南方
请尝试以下操作：
添加到body以下 CSS 属性：
box-sizing: border-box;
overflow: hidden;
margin: 0;
padding: 0;
box-sizng - 宽度和高度属性（以及最小/最大属性）包括内容、填充和边框，但不包括边距。
溢出- 防止滚动。
填充和边距重置只是为了清理浏览器生成的任何额外空间。
这会#cursive稍微提升你的头衔，但你可以说（调整到你的好处）降低它：
margin: 4em 0 1em;
您可以选择仅在移动视口的@media 查询中添加或不添加上述内容，可能类似于（根据您的利益调整值）：
@media (max-width: 768px) {
body {
box-sizing: border-box;
overflow: hidden;
margin: 0;
padding: 0;
/* etc */
}
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
编辑于
相关文章
Related 相关文章
- 1
如何使我的网站响应智能手机
- 2
如何安装智能手机以恢复文件
- 3
智能手机模式下的网页菜单侵入他人
- 4
从网页使用智能手机摄像头扫描条形码
- 5
检测平板电脑和智能手机
- 6
OOP设计与智能手机的性能
- 7
使用libGDX访问智能手机的相机
- 8
获取智能手机的标识符
- 9
大屏幕智能手机的RWD失败
- 10
与iPhone /智能手机共享RAM？
- 11
从智能手机下载照片
- 12
仅为智能手机加载不同的JavaScript
- 13
压缩来自智能手机的视频
- 14
ExtJS 4 智能手机尺寸
- 15
CSS 媒体智能手机
- 16
我的联系表单与智能手机和PC的不同视图
- 17
Swift-我可以从其他智能手机访问SQLITE吗？
- 18
为什么我的智能手机不再呈现 Github 页面？
- 19
我可以在智能手机的浏览器上播放音频（）吗？
- 20
如何查看智能手机等嵌入式设备的启动图？
- 21
如何使用Convertigo将jQueryMobile项目安装到智能手机中？
- 22
如何为<input>的智能手机禁用“另存为”弹出窗口
- 23
如何使用JavaScript启用或禁用智能手机的GPS服务？
- 24
如何对NFC标签进行编码以将智能手机与蓝牙设备配对
- 25
Android / WiFi Direct-如何使用智能手机查找PC并建立连接
- 26
操作系统如何将智能手机视为存储设备？
- 27
如何通过Ubuntu扎根Lenovo k3 Note智能手机
- 28
如何使用Javascript发现智能手机或平板电脑的型号？
- 29
如何在Windows中将Android智能手机安装为驱动器？
我来说两句