Question

我确切地说有一个固定宽度的网站960px。我已经扩大了所有在手机上工作的内容。我可以使用固定宽度的视口，它工作得很漂亮，但谷歌一直给我错误，我不应该使用<meta name="viewport" content="width=961">谷歌要我使用<meta name=viewport content="width=device-width, initial-scale=1">或类似的非固定宽度而不是我的网站将不会被视为谷歌的移动友好。当我做google对我的视口所说的内容时，该网站以纵向视图滚动屏幕右侧。需要帮助来了解如何使用谷歌想要使用iPad和ios吗？

Answer 1

正在评论你的帖子的人是愚蠢的。如果您的元标记统计宽度为951，但设备上的宽度更多，那么这将使网站看起来很奇怪。这一切都取决于该设备的宽度。如果你担心SEO，那么meta标签就没那么了。您的内容，您的特定SEO元标记（描述，名称，标题等）将有助于此。

所以，我喜欢谷歌。为什么？因为他们从不撒谎，他们所做的一切都是惊人的。

因此，这是我的元标记在我设计或开发的所有网站上的显示方式。

<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" />

为什么？因为真正的响应网站需要这些。

您的所有代码都取决于您的CSS文件。所以，也许你的css文件名称为style.css - 很棒。假设您在标题中插入了三个徽标。一个用于桌面，一个用于平板电脑，一个用于移动真棒！

<img src="../logoMobile.png" class="logo_mobile" />
<img src="../logoTab.png" class="logo_tab"/>
<img src="../logo.png" class="logo"/>

这将是我的CSS

.logo_tab, .logo_mobile  {display:none;}

@media only screen and (max-width: 1024px), only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
.logo_tab {display:block;}
.logo, .logo_mobile  {display:none;}
 }

@media only screen and (max-width: 767px), only screen and (max-device-width: 480px), only screen and (max-width: 767px) {
.logo_mobile {display:block;}
.logo, .logo_tab  {display:none;}
}

希望你能阅读CSS，你已经知道我要去哪里了。基本上，我设计了一个适用于平板电脑，手机和桌面的徽标。我通常对标签和桌面使用相同的标识，但这完全取决于。

祝你好运。

iOS iPad平板电脑错误地渲染视口

1 个答案: