Javascript 如何使我的网络完全适合任何智能手机？_Javascript_Jquery_Html

Javascript 如何使我的网络完全适合任何智能手机？

javascript jquery html

Javascript 如何使我的网络完全适合任何智能手机？,javascript,jquery,html,Javascript,Jquery,Html,请用你的智能手机看一下，你会发现它有点不对劲。我把所有东西都放在中心，网络在桌面上看起来很好，但在智能手机上就不行了（我用的是iphone5s）。有没有什么方法可以让它成为任何智能手机的桌面？我有没有办法让它看起来像Gmail应用程序一样，你不能到处滚动我已经完成了所有的调整，如头部标签中的以下代码。但它不起作用。如果您需要在桌面中查找，请使用以下url：非常感谢你 <head> <meta charset="utf-8"> <meta http-equiv="

请用你的智能手机看一下，你会发现它有点不对劲。我把所有东西都放在中心，网络在桌面上看起来很好，但在智能手机上就不行了（我用的是iphone5s）。有没有什么方法可以让它成为任何智能手机的桌面？我有没有办法让它看起来像Gmail应用程序一样，你不能到处滚动

我已经完成了所有的调整，如头部标签中的以下代码。但它不起作用。如果您需要在桌面中查找，请使用以下url：

非常感谢你

<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">


抄写员

尝试以下操作：

将以下CSS属性添加到

body

：

box-sizing: border-box;
overflow: hidden;
margin: 0;
padding: 0;

框大小-宽度和高度属性（以及最小/最大属性）包括内容、填充和边框，但不包括边距

溢出-防止滚动

填充和边距重置只是为了清理浏览器生成的任何额外空间

这将使你的

#草书标题稍微有点高，但你可以通过（调整以获得好处）来降低标题：
您可以选择仅在@media query for mobile viewport中添加上述内容，也可以不添加，可以类似（调整值以使您受益）：
“你可以看到它有点不对劲”。不适合我-该网站在移动宽度上看起来不错。请更新您的问题，使其在问题本身的a中显示您的相关代码，并清楚地说明问题所在。“是否有任何方法可以使其成为任何类型智能手机的桌面？”没有，您也不想。网络的全部意义在于适应和适应您所使用的任何设备和条件。从一个浏览器到另一个浏览器，从一个设备到另一个设备，没有什么是通用的，这没有什么错。如果你有一些具体的事情要解决，请在问题中澄清。
margin: 4em 0 1em;

@media (max-width: 768px) {
  body {
    box-sizing: border-box;
    overflow: hidden;
    margin: 0;
    padding: 0;
    /* etc */
  }
}