css手写媒体查询 |css float 详解

@media screen and (max-width: 768px) {
/*在此处写设备屏幕小于等于768px时的样式*/
}

以上是一个最简单的媒体查询语句，它使用@meida关键字来声明一个媒体查询，然后使用and关键字添加一个或多个查询的特征，例如：最大或最小宽度，设备方向等等。

@media only screen and (min-width: 1200px) {
/*在此处写设备屏幕大于等于1200px时的样式*/
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
/*在此处写设备屏幕在992px至1199px之间时的样式*/
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
/*在此处写设备屏幕在768px至991px之间时的样式*/
}
@media only screen and (max-width: 767px) {
/*在此处写设备屏幕小于等于767px时的样式*/
}

以上是几个不同屏幕宽度范围的媒体查询示例，可以根据需求添加更多的媒体查询语句。使用媒体查询时，大家可以针对不同屏幕宽度、设备方向、分辨率等等，使用不同的样式代码适配不同的设备，为用户提供更好的浏览体验。