媒体查询是CSS3的一个很重要的特性。它可以让CSS根据设备的特性进行不同的布局。在响应式设计中,媒体查询是非常实用的。下面我们来了解一下关于CSS中媒体查询的代码。首先,我们需要在CSS中写入媒体查
@media mediatype and (expression) { CSS代码 }
/* 当设备的宽度小于等于768像素时使用这些样式 */ @media screen and (max-width: 768px) { body { background-color: yellow; } } /* 当设备的宽度大于768像素时使用这些样式 */ @media screen and (min-width: 769px) { body { background-color: blue; } }
/* 根据设备类型,设置不同的背景颜色 */ @media screen { body { background-color: yellow; } } @media print { body { background-color: white; } }
粉丝
0
关注
0
收藏
0