我在继承的CSS文件中找到了这段代码，但是我觉得毫无意义：
@media screen and (max-width: 1024px){
img.bg {
left: 50%;
margin-left: -512px; }
}
具体来说，第一行发生了什么？
\`media屏幕和（最大宽度：1024像素）在CSS中是什么意思？
第3590篇《\`media屏幕和（最大宽度：1024像素）在CSS中是什么意思？》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点
共8个回答
如果您的媒体查询条件为true，则具有该条件的CSS将起作用。这意味着媒体查询条件像素大小内的CSS将生效，否则，如果条件失败，则意味着设备宽度大于1024px而不是CSS无效。因为媒体查询条件为false。
max-width 是您在该宽度之前的最大CSS限制。
它说：当页面以最大1024像素的宽度分辨率在屏幕上呈现时，请遵循以下规则。
您可能实际上已经知道，您可以将某些CSS定位到一种媒体类型，该媒体类型可以是手持设备，屏幕，打印机等之一。
看看这里的细节..
它限制了屏幕上定义的样式（例如，不打印或其他介质），并且进一步将范围限制为宽度小于或等于1024像素的视口。
就我而言，我想在浏览器数量800px不多的情况下将徽标放置在网站上，然后使用@media标记来做到这一点：
@media screen and (max-width: 800px) {
#logo {
float: none;
margin: 0;
text-align: center;
display: block;
width: auto;
}
}
它对我有用，希望有人觉得这个解决方案有用。:)有关更多信息，请参见this。
这意味着，如果屏幕大小为1024，则仅适用于CSS规则。
那就是媒体查询。它允许您将部分CSS规则仅应用于特定配置上的特定设备。
那是媒体查询。除非浏览器通过其中包含的测试，否则它将阻止运行其中的CSS。
此媒体查询中的测试是：
@media screen—浏览器将自己标识为“屏幕”类别。这大致意味着浏览器将自己视为台式机类，而不是例如较旧的手机浏览器（请注意，iPhone和其他智能手机浏览器确实将自己标识为屏幕类别）或屏幕阅读器，并且该浏览器正在显示屏幕上的页面，而不是打印页面。max-width: 1024px—浏览器窗口（包括滚动条）的宽度为1024像素或更小。（CSS像素，而不是设备像素。）
That second test suggests this is intended to limit the CSS to the iPad, iPhone, and similar devices (because some older browsers don’t support max-width in media queries, and a lot of desktop browsers are run wider than 1024 pixels).
However, it will also apply to desktop browser windows less than 1024 pixels wide, in browsers that support the max-width media query.
Here’s the Media Queries spec, it’s pretty readable:
相似问题
问题类别
它针对某些指定功能来执行其他一些代码...
例如：
the above snippet say if the device that run this program have screen with 600px or less than 600px width, in this case our program must execute this part .