微信小程序 图片横向显示

微信小程序中可以使用 `image` 组件和 CSS 样式来实现图片横向显示，具体步骤如下：

1. 在 `wxml` 文件中，使用 `image` 组件来显示图片。设置 `mode` 属性为 `widthFix`，表示保持宽度不变，高度自适应。

<image src="{{imageUrl}}" mode="widthFix"></image>

2. 在 `wxss` 文件中，使用 CSS 样式来控制图片的宽度和高度。设置图片的宽度为页面宽度，高度为自适应。

image {
  width: 100%;
  height: auto;
}

3. 修改页面的 `json` 配置文件，设置页面的背景色为白色，以便更好地显示图片。

{
  "navigationBarTitleText": "图片横向显示",
  "backgroundColor": "#ffffff"
}

完整的示例代码如下：

<!-- index.wxml -->
<image src="{{imageUrl}}" mode="widthFix"></image>

/* index.wxss */
image {
  width: 100%;
  height: auto;
}

// index.json
{
  "navigationBarTitleText": "图片横向显示",
  "backgroundColor": "#ffffff"
}

需要注意的是，在实际使用中，如果图片宽度过大，可能会导致页面加载速度变慢，影响用户体验。因此，在选择图片时需要注意图片大小和质量，以便更好地显示和加载。