css - 如何在离子中制作垂直范围滑块

Question

在我的应用程序中，我必须选择人的身高，所以我想垂直自定义离子范围滑块，如下图所示

https://i.stack.imgur.com/Mmwhc.png

标签： cssionic-frameworkionic5

Answer 1

您可以使用 css: html 旋转 Div

<div class="a">
  <ion-item>
   <ion-range min="1000" max="2000" step="100" snaps="true" ticks="false" color="secondary"></ion-range>
  </ion-item>    
</div>

css

 div.a {
      width: 150px;
      height: 80px;
      background-color: yellow;
      -ms-transform: rotate(270deg); /* IE 9 */
      transform: rotate(270deg);
    }