本文介绍了响应式网站只能在台式机上运行,​​而不能在移动设备上运行的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在开发此响应式Wordpress网站: http://www.allisoncassels.com/Test/,并且我的媒体查询有问题.

I'm working on developing this responsive Wordpress site: http://www.allisoncassels.com/Test/ and having a problem with my media queries.

我为以下断点编码了CSS:

I coded the CSS for the following breakpoints:

/* Portrait Tablets */
@media only screen and (min-width: 768px) and (max-width: 959px)

/*  Portrait Mobiles */
@media only screen and (max-width: 767px)

/* Landscape Mobiles */
@media only screen and (min-width: 480px) and (max-width: 767px)

在台式机上,一切看起来都很不错.在我的手机和平板电脑上,有些东西可以移动,有些东西仍然像台式机一样显示(我已显示的东西:没有显示,div宽度没有显示,等等)

On desktop, everything looks great. On my phone and tablet, some things are mobile and some things are still showing like the desktop (stuff I have display: none on is showing, div widths are off, etc.)

我唯一能弄清楚的是它与我的手机/平板电脑的视网膜显示有关,但是我看不到其他网站必须将其计入他们的计算...

The only thing I can figure out is that it's related to my phone/tablet being retina display, but I don't see other sites having to factor that into their calculations...

现在真的感到困惑,我将不胜感激.谢谢

Really baffled right now, I'll appreciate any help. Thanks

推荐答案

将此放在您的脑海中!!! :P

Put this in your head!!! :P

在meta标签内.

name ="viewport" content ="width = device-width,初始比例= 1,最大比例= 1"/>

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

干杯,标记

这篇关于响应式网站只能在台式机上运行,​​而不能在移动设备上运行的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

07-02 21:53