Html 我的网站反应灵敏，但大小不合适

所以我制作了一个响应性强的网站，但网站在应该改变的时候没有改变。 我在下面链接的网站显示，在我的iphone6plus上，它的格式应该正确，但当我在Iphone上查看网站时，它处于平板电脑查看模式

你可以看看我的意思

CSS代码

html*{
填充：0；
保证金：0；
框大小：边框框；
字体系列：“蒙特塞拉特”，无衬线；
}
身体{
左边距：自动；
右边距：自动；
}
标题{
垫底：1px；
}
页脚{
文本对齐：居中；
}
.标志{
边界半径：10px；
高度：100px；
边缘顶部：15px；
边缘底部：5px；
宽度：178px；
左边距：自动；
右边距：自动；
显示：块；
}
img{
宽度：100%；
最大宽度：100%；
高度：自动；
垂直对齐：中间对齐；
}
.样式导航{
列表样式类型：无；
文本对齐：居中；
}
.样式导航ul li a{
文字装饰：无；
颜色：#2F32A；
文本对齐：居中；
显示：块；
文本转换：大写；
填充：8px；
}
.样式导航ul li a：悬停{
颜色：黑色；
文本阴影：2PX2PX10PX#000000；
过渡：0.5s缓解；
-webkit过渡：0.5s易用性；
}
.英雄{
背景图像：url（../Images/background.jpg）；
背景尺寸：封面；
填充顶部：15px；
左侧填充：20px；
右边填充：20px；
填充底部：50px；
颜色：#FFFFFF；
文本对齐：居中；
}
.infobox tan{
背景色：#C29D73；
颜色：#FFFFFF；
填充：30px 20px 60px；
文本对齐：居中；
}
.infobox灰色{
背景色：#717A84；
颜色：#FFFFFF；
填充：30px 20px 60px；
文本对齐：居中；
}
.罗：之前，
.罗：之后{
内容：“；
显示：表格；
颜色：#FFFFFF；
文本对齐：居中；
}
h1.小型{
字体大小：30px；
文本转换：大写；
字号：200；
边缘底部：60px；
}
氢{
字体大小：25px；
文本转换：大写；
字号：100；
边缘底部：20px；
填充：30px
}
h3{
字体大小：16px；
文本转换：大写；
字号：200；
边缘底部：60px；
}
h4{
字体大小：16px；
字号：200；
边缘底部：35px；
}
p{
字体大小：15px；
文本转换：无；
字号：20；
边缘底部：60px；
}
p、 页脚文本{
颜色：灰色；
字体大小：15px；
文本转换：无；
字号：20；
边缘顶部：20px；
边缘底部：20px；
}
.按钮{
边界半径：30px；
边框：2px#FFFFFF实心；
填充：8px 15px；
颜色：#FFFFFF；
文字装饰：无；
边缘底部：30px；
}
.按钮：悬停{
颜色：#2424；
边框：2px#2424实心；
过渡：0.5s缓解；
-webkit过渡：0.5s易用性；
}
.罗：之后{
明确：两者皆有；
}
上校{
宽度：100%；
}
/*平板电脑视图*/
@介质（最小宽度：700px）{
.style标志{
浮动：中心；
}
身体{
最大宽度：778px；
}
.样式导航ul li{
显示：内联块；
}
h1.正常{
字体大小：57px；
文本转换：大写；
字号：200；
边缘底部：60px；
}
.罗：之前，
.罗：之后{
内容：“；
显示：表格；
填充物：5px；
颜色：#FFFFFF；
文本对齐：居中；
}
上校药片{
宽度：50%；
}
上校{
浮动：左；
填充底部：14px；
左侧填充：7px；
右侧填充：7px；
}
}
/*桌面视图*/
@介质（最小宽度：1024px）{
.style标志{
浮动：中心；
}
.样式导航{
浮动：中心；
}
.col桌面{
宽度：25%；
}
身体{
最大宽度：1200px；
}
}

家





编辑的选择
马丁诺塔酒店
网站设计
教育类
并总结了我的成就

服务
图形/网页设计-视频/照片编辑

©2018马丁诺塔

您缺少

（…）苹果在Safari iOS中引入了“viewport meta标签”，让 web开发人员控制视口的大小和比例。许多其他 移动浏览器现在支持此标记，尽管它不是任何应用程序的一部分 网络标准。苹果的文档很好地解释了web是如何工作的 开发人员可以使用这个标签，但是我们必须做一些检测工作来 弄清楚如何在Fennec中实现它。例如 Safari的文档称其内容是一个“逗号分隔的列表” 但是现有的浏览器和网页使用逗号、分号和， 和空间作为分隔符

您缺少

（…）苹果在Safari iOS中引入了“viewport meta标签”，让 web开发人员控制视口的大小和比例。许多其他 移动浏览器现在支持此标记，尽管它不是任何应用程序的一部分 网络标准。苹果的文档很好地解释了web是如何工作的 开发人员可以使用这个标签，但是我们必须做一些检测工作来 弄清楚如何在Fennec中实现它。例如 Safari的文档称其内容是一个“逗号分隔的列表” 但是现有的浏览器和网页使用逗号、分号和， 和空间作为分隔符

---

您的iPhone每英寸的像素数比标准桌面屏幕的像素数多，而且实际上宽度大于700像素。为了让网页将像素视为屏幕大小的一个单位，您需要

---

使用此标签，您的媒体查询将如同屏幕是标准的72 ppi一样运行。

您的iPhone的每英寸像素数比标准桌面屏幕的每英寸像素数多，并且实际上宽度大于700像素。为了让网页将像素视为屏幕大小的一个单位，您需要

使用此标签，您的媒体查询将按您的方式运行

<meta name="viewport" content="width=device-width, initial-scale=1">

<meta name="viewport" content="width=device-width, initial-scale=1">