css - 如何修改 Ionic 2 slider 以使其具有多行(网格类型 4x4,每页 16 个)?

标签 css ionic-framework ionic2 ionic-view

我正在使用 Ionic2 slider ,来自其组件:http://ionicframework.com/docs/v2/api/components/slides/Slides/ . 我不知道如何让 slider 在多行上显示元素,每张幻灯片 4x4 = 16 个元素。

这是我的代码。实际页面中生成的 html 代码看起来不同。

            <ion-slides pager slidesPerView="16" spaceBetween="20">
                <ion-slide style="background-color: green">
                     <h2>Slide 1</h2>
                </ion-slide>
                <ion-slide style="background-color: blue">
                    <h2>Slide 2</h2>
                </ion-slide>
                <ion-slide style="background-color: red">
                    <h2>Slide 3</h2>
                </ion-slide>
                <ion-slide style="background-color: green">
                     <h2>Slide 1</h2>
                </ion-slide>
                <ion-slide style="background-color: blue">
                    <h2>Slide 2</h2>
                </ion-slide>
                <ion-slide style="background-color: red">
                    <h2>Slide 3</h2>
                </ion-slide>
            </ion-slides>

最佳答案

尝试嵌套 ionic 网格 Components在每张幻灯片中。 这是 API docs for the grid

关于css - 如何修改 Ionic 2 slider 以使其具有多行(网格类型 4x4,每页 16 个)?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42227125/

相关文章:

javascript - 具有透明背景悬停效果的圆 Angular

angularjs - Ionic 中的自动完成

javascript - Angular 管 : Cannot replace/n

css - 动画属性的 IE10 CSS hack?

html - 在 CSS/HTML 中使用图像调整大小重新定位文本

javascript - 如何在浏览器的滚动条中只隐藏拖动元素?

angular - Angular2 中的复选框组处理和验证

angular - 如何重启ngOnInit来更新Interpolation

ionic-framework - 在 Ionic FAB 列表中插入标签的正确方法是什么

angular - 如何在Ionic中实现搜索和过滤