vue 图片 置底居中

要在Vue中将图片置底居中，你可以使用CSS样式来控制图片的定位和对齐方式。下面是一种常见的方法，可以让图片在其容器底部居中：

<template>
  <div class="container">
    <img src="路径/到/你的/图片.jpg" alt="图片" class="bottom-centered-image">
  </div>
</template>

<style>
.container {
  position: relative;
  width: 100%;
  height: 100vh; /* 设置容器的高度，可以根据需要调整 */
  display: flex;
  justify-content: center;
  align-items: flex-end;
}

.bottom-centered-image {
  max-width: 100%;
  max-height: 100%;
}
</style>

在上面的示例中，我们将图片放置在一个容器（`<div>`元素）中。通过设置容器的CSS样式，我们使用`position: relative;`来创建一个相对定位的容器，并设置`width`和`height`来确定容器的大小。

我们使用了`display: flex;`来创建一个弹性布局，并通过`justify-content: center;`和`align-items: flex-end;`将图片水平居中和垂直置底。

最后，我们将图片的最大宽度和最大高度设置为100%，以使其适应容器大小。

请将示例代码嵌入到你的Vue组件中，并根据需要进行调整。这样，你就可以实现在Vue中将图片置底居中了。

希望这个示例对你有帮助！如果你有任何其他问题，请随时提问。