在移动端webview渲染的时候,html标签会被自动加入一个class属性,会标识不同的设备
如:
- android上是 android mobile
- iPhone上是 ios phone mobile
- iPad上是 ios ipad tablet
- PC和Mac上的Chrome不会插入这个class属性
所以,可以用来适配一些移动双端的差异场景,如适配不同高度Titlebar
不同样式:
.ios .titlebar {
height: 80px
}
.android .titlebar {
height: 60px
}
使用样式:
<div class="titlebar">
<!-- 使用 -->
</div>
在iOS设备上就会展示80px,Android设备上60px