Question

Hy，我很感激在我的网站上提供缩放/响应式设计方面的一些帮助。基本上，我想知道为什么我的网站，以及如何禁用它 - 在放大时，根据媒体查询重新授权div。我想媒体查询只在浏览器/屏幕调整大小，而不是缩放。下面是我的大纲代码：

＆＃13;

    body {
		background-image: url(../img/Fotolia.jpg);
		background-position: center center;
		background-repeat: no-repeat;
		background-attachment: fixed;
		background-size: cover;
		background-color: #464646;
		font-family: "Open Sans",Arial,sans-serif;
		font-size: 14px;
		max-width: 100%;
	}
	
	.container {
		padding: 20px 20px 30px 20px;
		margin-right: auto;
		margin-left: auto;
		margin-top: 35px;
		margin-bottom: 35px;
		max-width: 1300px;
		text-align: justify;
		vertical-align: text-top;
		border-radius: 4px;
		border: 0px solid red;
		background-color: white;
		position: relative;
		overflow: hidden;
		background: #f3f3f3;
	}

    @media only screen and (max-width: 1350px) {
        some stuff
    }

    @media only screen and (max-width: 1090px) {
        some stuff
    }

    @media only screen and (max-width: 650px) {
        some stuff
    }

＆＃13;

        <body>
            <div class="container">
                <div class="left">
                </div>

                <div class="right">
                </div>
            </div>

＆＃13;

当将浏览器缩放到150％时，1350px开始，180％缩放1090开始，依此类推。如何在缩放时禁用响应式设计？ THX。

Answer 1

您可以添加元标记来禁用缩放吗？据我所知，缩放时无法停止响应。

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

Answer 2

当用户缩放时，他们会要求浏览器将每个像素放大。

由于像素越大，窗口中的像素就越少。

这会改变宽度，从而改变适用的最大宽度@media规则。

你无法阻止这种情况。

在缩放时阻止响应式设计启动

2 个答案: