我正在使用bootstrap 3制作响应式网站，并且在我调整浏览器大小时它可以正常工作。但是，当我从移动设备（诺基亚lumia 920 Internet Explorer）打开网站时，它根本没有响应。 Bootstrap列不起作用，断点不起作用。我用谷歌搜索了它，改变断点并没有帮助。这是我的HTML
<!DOCTYPE html>
<html class="no-js" data-placeholder-focus="false">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=0" />
<meta name="mobileoptimized" content="0" />
<title>index</title>
<meta name="description" content="" />
<meta name="keywords" content="" />
<meta name="author" content="Constr" />
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" href="css/owl.carousel.css">
<link rel="stylesheet" href="css/animate.css">
<link rel="stylesheet" href="css/custom.css">
<link rel="shortcut icon" href="">
<link rel="apple-touch-icon" href="">
<link rel="apple-touch-icon" sizes="72x72" href="">
<link rel="apple-touch-icon" sizes="114x114" href="">
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
这是我的CSS，我正在使用SASS
$screen-lg-min: 1200px;
$screen-md-max: 1199px;
$screen-md-min: 992px;
$screen-sm-max: 991px;
$screen-sm-min: 768px;
$screen-xs-max: 767px;
@media (min-width: $screen-lg-min) {
}
/* Medium Devices, Desktops */
@media (min-width: $screen-md-min) and (max-width: $screen-md-max) {
}
/* Small Devices, Tablets */
@media (min-width: $screen-sm-min) and (max-width: $screen-sm-max) {
}
/* Extra Small Devices, Phones */
@media (max-width: $screen-xs-max) {
}
@-ms-viewport{
width: device-width;
}
请帮帮我！谢谢！
答案 0 :(得分：3)
您需要为initial-scale提供 1 。
<meta name="viewport" content="width=device-width, initial-scale=1">
答案 1 :(得分：-1)
您需要将此代码放在<meta name>之后。
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3pro.css">
示例：
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3pro.css">