如何在旋转木马中心设置图像 (Onsen-UI)

Question

我正在使用 Onsen-ui 和 angularjs。我正在尝试将图像设置在旋转木马的中心，但它们总是在左侧对齐，这是我的代码

<ons-carousel direction="horizontal" style="height: 62.5%; background-color: blue;" swipeable auto-scroll overscrollable id="carousel">

<ons-carousel-item style="margin: auto">
  <img src="images/carousel1.jpg" style="margin: auto; height: 100%">
</ons-carousel-item >

<ons-carousel-item style="margin: auto">
  <img src="images/carousel2.jpg" style="height: 100%; margin: auto"> 
</ons-carousel-item>

<ons-carousel-item style="margin: auto">
   <img src="images/carousel3.jpg" style="height: 100%; margin: auto">
 </ons-carousel-item>

请帮我解决这个问题

Answer 1

尝试

ons-carousel-item {
    text-align: center;
}

如果还是不行：

ons-carousel-item img {
    margin-left: auto;
    margin-right: auto;
}

如何在旋转木马中心设置图像 (Onsen-UI)

How to set images in center of carousel (Onsen-UI)

html

css

angularjs

onsen-ui