如何用Media Queries实现屏幕≥600px时表单宽600px？求代码验证

• 核心逻辑是对的：你写的@media only screen and (min-width: 600px)媒体查询，确实会在屏幕宽度大于等于600px时，给带有.form类的元素设置600px的宽度，完全符合你的需求。
• 存在的小问题：width: 600px}这一行末尾缺少分号，CSS的每条声明都需要以分号结尾——哪怕是规则里的最后一条，补上分号才能保证代码语法完全正确，修正后应为width: 600px;

修正后的完整代码如下：

@media only screen and (min-width: 600px) {
  .form {
    width: 600px;
  }
}

额外提一句：如果希望小屏幕下表单能自适应父容器宽度，可以在媒体查询外面给.form加个默认宽度，比如：

.form {
  width: 100%;
}

@media only screen and (min-width: 600px) {
  .form {
    width: 600px;
  }
}

这样在屏幕宽度小于600px时，表单会占满父容器，体验更友好。

内容的提问来源于stack exchange，提问作者mitoman