css响应体 |css3 过滤 class

css实现闪电，css 多重继承吗，css 弹性布局多行布局，css清除之前全部样式，css3作品集，css 盒子默认多三像素，css3 过滤 class css响应体 |css3 过滤 class

/* 媒体查询 */
@media(max-width: 600px){
/* 手机屏幕尺寸下的样式 */
body{
font-size: 16px;
}
}
@media(min-width: 601px) and (max-width: 992px){
/* 平板屏幕尺寸下的样式 */
body{
font-size: 18px;
}
}
@media(min-width: 993px) and (max-width: 1200px){
/* 小屏幕台式机尺寸下的样式 */
body{
font-size: 20px;
}
}
@media(min-width: 1201px){
/* 大屏幕尺寸下的样式 */
body{
font-size: 24px;
}
}

如上代码展示了如何使用媒体查询来定义不同屏幕尺寸下的网页字体大小。在媒体查询中，大家使用@media关键字来定义媒体类型，然后通过指定不同的屏幕宽度范围来确定不同样式的应用条件。

除了字体大小，CSS响应式体还可应用到布局、颜色、边框等样式属性上。通过合理运用CSS响应式体，大家可以创建出在不同设备上都能完美呈现的网页。