Question

嗨，我正在使用html，但是当我在头中添加以下<meta>元素时，视口在电话和Chrome设备模式下不会更改：

<!DOCTYPE html>
<html>
<head>
	
	<title>phone</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0">

</head>
<body style="background-image: url('space.jpg')">
     <img src="https://www.drgoulu.com/wp-content/uploads/HLIC/c2281c83670e31d8aaab7cb642b824db.png">
     <p>Python est un langage de programmation objet, multi-paradigme et multiplateformes. Il favorise la programmation impérative structurée, fonctionnelle et orientée objet. Wikipédia</p>

</body>
</html>

有人知道这是什么原因吗？

Answer 1

尝试将width: 100%放在img标记中

# style.css

img {
    max-width: 100%;
    # or simple width
    # width: 100%;
}

或直接在img标签中

<img style="width: 100%" src="https://www.drgoulu.com/wp-content/uploads/HLIC/c2281c83670e31d8aaab7cb642b824db.png">

Meta视口在手机和Chrome设备模式下完全无效

1 个答案: