uniapp使用媒体查询

在uniapp中使用媒体查询可以通过CSS样式的 @media 规则来实现。以下是一些示例代码：

在样式文件中定义媒体查询：

/* 定义一个媒体查询 */
@media screen and (max-width: 640px) {
    /* 当屏幕宽度小于等于640px时应用这些样式 */
    .container {
        width: 100%;
        padding: 10px;
    }
}

/* 在元素中应用媒体查询 */
.container {
    width: 80%;
    padding: 20px;
}

/* 当屏幕宽度小于等于640px时，会覆盖上面的样式 */

在组件中使用媒体查询：

<template>
  <view class="container">
    <view class="content">Content</view>
  </view>
</template>

<style>
/* 定义一个媒体查询 */
@media screen and (max-width: 640px) {
  /* 当屏幕宽度小于等于640px时应用这些样式 */
  .container {
    width: 100%;
    padding: 10px;
  }
}

/* 在组件中应用媒体查询 */
.container {
  width: 80%;
  padding: 20px;
}

/* 当屏幕宽度小于等于640px时，会覆盖上面的样式 */
</style>

以上示例代码可以根据屏幕宽度的大小来应用不同的样式，实现响应式布局。