css媒体查询是什么意思 |简单的css个人博客

@media screen and (max-width: 768px) {
/* 在视口宽度小于等于768px时应用这些样式 */
p {
font-size: 18px;
line-height: 1.5;
}
}
@media print {
/* 在打印页面时应用这些样式 */
p {
font-size: 14px;
line-height: 1.2;
}
}

如上所示，在媒体查询语句（@media）中指定条件，例如“仅在视口宽度小于等于768px时应用这些样式”或“在打印页面时应用这些样式”。在花括号内编写CSS样式，它们仅在满足媒体查询条件时应用。

通过使用CSS媒体查询，您可以使您的网站更具响应性，使不同设备的用户获得最佳的浏览体验。这种技术尤其对移动设备越来越重要。