在移动设备上缩放时,页面内容溢出(向左和向右)



代码在台式计算机 (PC( 上运行良好,当我放大和缩小时,文本仍然存在,但在移动设备上,当我尝试放大此页面时,文本超过了屏幕视图的左右边框。

我该如何防止这种情况?我希望唯一的滚动是向上和向下滚动,而不是向左和向右滚动,并且用户将看到所有页面内容而不会溢出到两侧。

你可以在这里测试我的代码:

http://fireman-suppression-84203.bitballoon.com

这是代码:

div {
width: 85%;
margin: auto;
border: 3px solid #73AD21;
}
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<div>Just an example text... Just an example text... Just an example text... Just an example text... Just an example text... Just an example text... Just an example text... Just an example text... Just an example text... Just an example text... Just an example
text... Just an example text... Just an example text... Just an example text... Just an example text... Just an example text... Just an example text... Just an example text... Just an example text... Just an example text... Just an example text... Just
an example text... Just an example text... Just an example text... </div>
<br>

在你的<head>试试这个:

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

相关内容

  • 没有找到相关文章

最新更新