gpt4 book ai didi

css - 基于 HTML5 媒体查询的 CSS 链接不起作用

转载 作者:太空宇宙 更新时间:2023-11-03 17:46:54 25 4
gpt4 key购买 nike

在我的 html 页面中,我正在使用基于 cssmedia query 但它不起作用。

html:

<!DOCTYPE>
<html>
<!--[if IE 9]>
<html lang="en-us" class="ie9">
<![endif]-->

<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="../css/reset.css">
<link rel="stylesheet" href="../css/login.css">
<link rel='stylesheet' media='screen(min-device-width : 320px) and (max-device-width : 480px)' href='../css/max480.css' /> //properly linked.
<title>Welcome to ClearBid Login</title>
</head>
<body class="loginPage">

样式:

.loginContent > section {
background: none; //it always visible.
}

我还需要做什么?

最佳答案

少了一个“and”。您需要将 [media] 属性中的每个语句与“和”组合起来:

screen and (min-device-width: 320px) and (max-device-width: 480px)

哦嘿,你的 html 文件顶部有一个带有条件注释的错误。 IE9 看到两个打开的 HTML 元素,这可能会导致兼容模式。正确的是:

<!DOCTYPE html>
<!--[if IE 9]><html lang="en-us" class="ie9"><![endif]-->
<!--[if gt IE 9]><!-->
<html lang="en-us" class="not-ie9">
<!--<![endif]-->

关于css - 基于 HTML5 媒体查询的 CSS 链接不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27987739/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com