css媒体查询根据屏幕大小写法

CSS媒体查询根据屏幕大小的写法如下：

1. 使用@media规则来定义媒体查询，并在括号中指定查询的条件，例如屏幕宽度或高度。

2. 在媒体查询的大括号内，编写适用于指定条件的CSS样式。

以下是一些常见的媒体查询示例：

1. 根据屏幕宽度设置样式：

@media (max-width: 768px) {
  /* 在屏幕宽度小于等于768px时应用的样式 */
}

@media (min-width: 768px) and (max-width: 1024px) {
  /* 在屏幕宽度在768px和1024px之间时应用的样式 */
}

@media (min-width: 1025px) {
  /* 在屏幕宽度大于等于1025px时应用的样式 */
}

2. 根据屏幕方向设置样式：

@media (orientation: landscape) {
  /* 在横向屏幕方向时应用的样式 */
}

@media (orientation: portrait) {
  /* 在纵向屏幕方向时应用的样式 */
}

3. 根据设备类型设置样式：

@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
  /* 在平板横向屏幕时应用的样式 */
}

@media (min-width: 1025px) and (orientation: landscape) {
  /* 在大屏幕横向屏幕时应用的样式 */
}

@media screen and (min-width: 1025px) and (orientation: landscape) {
  /* 在大屏幕横向屏幕时应用的样式（仅适用于屏幕设备） */
}

请注意，以上只是一些常见的媒体查询示例，您可以根据具体需求自定义媒体查询条件和样式