0

我使用了下面的东西但没有用，我的页面宽度是 1170px，它不适合移动设备。是这个网站的新手，任何人都可以帮助我吗？提前致谢。

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, user-scalable=yes" />
<meta name="viewport" content="target-densitydpi=device-dpi" /> 
<meta name="HandheldFriendly" content="true"/>
<meta name="viewport" content="width=device-width" />

<meta name="viewport" content=", initial-scale=0.5" />

<meta name="viewport" content="width=480, user-scalable = yes, initial-scale=1.0, maximum-scale=1, minimum-scale=1">
<meta name = "viewport" content = "width = device-width, initial-scale = 0.33, user-scalable = yes"></meta>
<meta name = "viewport" content = "width = 980px, initial-scale=0.4, maximum-scale=1" />
<meta name="viewport" content="width=320, maximum-scale=1, minimum-scale=1, initial-scale=0">
4

1 回答 1

1

我建议使用下面的。

头下：

<meta name="viewport" content="initial-scale=1.0">

在您的样式表下：

/* Smartphones (portrait and landscape) ----------- */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px) {
/* Your Styles */
}

/* Smartphones (landscape) ----------- */
@media only screen
and (min-width : 321px) {
/* Your Styles */
}

/* Smartphones (portrait) ----------- */
@media only screen
and (max-width : 320px) {
/* Your Styles */
}

/* iPads (portrait and landscape) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) {
/* Your Styles */
}

/* iPads (landscape) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape) {
/* Your Styles */
}

/* iPads (portrait) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait) {
/* Your Styles */
}

/* Desktops and laptops ----------- */
@media only screen
and (min-width : 1224px) {
/* Your Styles */
}

/* Large screens ----------- */
@media only screen
and (min-width : 1824px) {
/* Your Styles */
}

/* iPhone 4 ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5) {
/* Your Styles */

将你所有的标签、ID、类、选择器等放在上面的@media 中，你就会得到适合多个设备平台的东西。

希望这可以帮助。

于 2013-05-15T08:10:22.580 回答