html meta视口标签 [英] html meta viewport tag

问题描述

我建立了一个HTML登陆页面，您可以在此处看到它 我以这种方式使用了meta视口标签:

I build an html landing page, you can see it here I used the meta viewport tag in that way:

<meta name="viewport" content="width=device-width">

当我从移动设备进入此页面时，页面宽度不适合屏幕， iPhone示例- http://mobiletest.me/iphone_5_emulator/#u = http://tzabar.exactive.co.il/ 我做错了什么?

When I enter to this page from the mobile, the page width that not fit to the screen, Iphone example - http://mobiletest.me/iphone_5_emulator/#u=http://tzabar.exactive.co.il/ what I've done wrong?

推荐答案

---

根据War10ck的建议，考虑将您的视口元标记更改为以下内容:

---

As per War10ck's suggestion consider changing your viewport meta tag to something like the following:

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

您还可以在CSS中进行更改以帮助您.考虑更改.content类.例如:

You can also make changes in your CSS to help you along. Consider changing the .content class. For example:

.content{
  width: 100%;
  max-width: 930px;
}

我不确定您的最终设计目标是什么，但这应该使您朝着正确的方向前进.您还可以查看类似Bootstrap http://getbootstrap.com/的内容，以帮助您使网站具有响应性.

I'm not sure what your ultimate design goal is, but that should get you moving in the right direction. You could also look into something like Bootstrap http://getbootstrap.com/ to help you make sites responsive.

这篇关于html meta视口标签的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！