Z-index: 用于将一个元素放另一个元素之后,但是用于postion之上才行。
position 规定元素的定位类型:
值 | 含义 |
---|---|
absolute | 绝对对位,相对于 他的父元素位置。 (可通过top等定位) |
fixed | 绝对定位,相对于浏览器 窗口进行定位,不是对于他的父元素。(可通过top等定位) |
relative | 相对定位,相对于其正常位置定位 |
static | 默认值,无定位 (忽略top等定位) |
inherit | 从父元素继承position属性值 |
top定位例如:
.class{
position: absolute;
top: 5%;
}
display:none: 表示不显示,但是可以调用,我们可以利用调取Id方法来 实现此功能
比如我们用获取本地图片:但是我们不能让他人看到,我们直接用此属性在HTML代码中国:
<!-- 获取本地图片 -->
<input style="margin-top: 15%; display:none;" #file type="file" id="file" ng2FileSelect (change)="selectedFileOnChanged(file)">
然后我们在ts方法中获取到此id,然后执行click事件代替点击按钮。
const mybutton = document.getElementById('file');
mybutton.click();
样式穿透
- 前缀添加: /deep/ 此可以穿透掉ionic封装 的代码
- 前缀添加:>>> 此是替代的/deep/
- 某样式后面添加:!important 强制使用此样式
/deep/ .tankuang{
// .alert-message {
// max-width: 15%;
// max-height: 15%;
// }
/deep/ .alert-button-group{
justify-content: center;
}
/deep/ .alert-button-inner{
font-size: 20px !important;
}
}
附属:
opacity: 0.32 《透明度》
float:left 《浮动》
margin-top: 5% 《外边层距离,但是是占位符的。》
font-family: 幼圆 《字体》
font-size:15% 《字体大小》
display: -webkit-inline-box; 《让图片下的文字和外边框有间距》