css - 在幻灯片 ionic 3 中添加关闭
问题描述
我想在幻灯片的右上角添加一个 X,并希望他始终可见。没能弄清楚问题所在。
目前 X 按钮位于滑块之外。
我的 html
<ion-content padding>
<button>
<ion-icon class="close" name="close" (click)="dismiss()"></ion-icon>
</button>
<ion-slides pager>
<ion-slide>
<h2>Slide 1</h2>
</ion-slide>
<ion-slide >
<h2>Slide 2</h2>
</ion-slide>
<ion-slide>
<h2>Slide 3</h2>
</ion-slide>
<ion-slide>
<h2>Slide 4</h2>
</ion-slide>
<ion-slide>
<h2>Slide 5</h2>
</ion-slide>
<ion-slide >
<h2>Slide 6</h2>
</ion-slide>
</ion-slides>
</ion-content>
我的scss
.swiper-pagination-bullet {
background: black;
opacity: 0.50;
}
.swiper-pagination-bullet-active {
opacity: 1;
background: black;
}
ion-slides {
background-color: red;
}
ion-slides .close {
margin-top: 100%;
font-size: 2em;
}
解决方案
推荐阅读
- jasperserver - Jasper 服务器“不支持融合组件”渲染 PDF
- c++ - 类型别名在类中有什么作用?
- sql - 一年无记录后的新纪录
- python - 在 Python 中从 3 元素元组创建字典 - TypeError
- python - Python的Pyserial可以接受的/dev/cu.usbmodem143301的MacOS的可行串行端口名称是什么?
- javascript - 在按钮单击时将视频添加到页面
- react-native - 如何检查组件中的当前活动页面?
- opentbs - OpenTBS 将公式输入 xlsx 单元格
- python - 如何删除df中整个列的某个字符之后的所有内容?
- android - Android RadioGroup 在双向数据绑定中获取选中的 RadioButton 索引(位置)