twitter-bootstrap – 如何添加响应式媒体查询

发布时间：2020-12-17 21:26:12 所属栏目：安全来源：网络整理

导读：这是一个示例代码,但我无法添加响应.如何为响应式媒体查询添加我的代码？ form action="action_page.php"First name:brinput type="text" name="firstname" value="Mickey"brLast name:brinput type="text" name="lastname" value="Mouse"brbrinput type="su

这是一个示例代码,但我无法添加响应.如何为响应式媒体查询添加我的代码？

<form action="action_page.php">
First name:<br>
<input type="text" name="firstname" value="Mickey">
<br>
Last name:<br>
<input type="text" name="lastname" value="Mouse">
<br><br>
<input type="submit" value="Submit">
</form>

解决方法

如果您正在谈论css3响应式媒体查询,您必须像这样添加

<head>
<meta name="viewport" content="width=device-width,initial-scale=1.0"/>
<style>
body {
    background-color:lightgreen;
}

@media only screen and (max-width: 500px) {
    body {
        background-color:lightblue;
    }
}
</style>
</head>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!