如何使用CSS Media查询使图像位于文本下方？

要使用CSS Media查询使图像位于文本下方，可以通过以下步骤实现：

1. 首先，在HTML文件中，确保图像和文本都被包裹在一个共同的容器元素内，例如一个div元素。
2. 在CSS文件中，使用媒体查询@media来针对特定的屏幕尺寸或设备类型应用样式。例如，可以使用以下代码来针对移动设备应用样式：

@media screen and (max-width: 768px) {
  .container {
    flex-direction: column;
  }
  .image {
    order: 2;
  }
  .text {
    order: 1;
  }
}

在上述代码中，我们使用@media查询来针对屏幕宽度小于等于768像素的情况应用样式。.container是包裹图像和文本的容器元素的类名，.image和.text分别是图像和文本的类名。

1. 在上述代码中，我们使用了flexbox布局来控制图像和文本的排列顺序。通过将容器元素的flex-direction属性设置为column，我们可以将图像和文本垂直排列。
2. 通过将图像的order属性设置为2，将文本的order属性设置为1，我们可以确保图像位于文本下方。

以下是一个示例的HTML和CSS代码：

<div class="container">
  <img src="image.jpg" alt="图像">
  <p class="text">这是一段文本。</p>
</div>

.container {
  display: flex;
}

.image {
  order: 2;
}

.text {
  order: 1;
}

@media screen and (max-width: 768px) {
  .container {
    flex-direction: column;
  }
}

这样，当屏幕宽度小于等于768像素时，图像将位于文本下方。

对于腾讯云相关产品和产品介绍链接地址，由于要求不能提及具体品牌商，建议您参考腾讯云的官方文档和开发者社区，以获取更多关于云计算和前端开发的相关信息。