APIbeta

设备识别

使用如下示例代码可以对不同设备进行样式指定.

1
2
3
4
5
6
7
8
9
<style lang="scss">
@import '@bpui/style';

div {
  @include bp-isPhone {
    display: none;
  }
}
</style>

example

See the Pen bpui-style-device by brainpoint (@brainpoint) on CodePen.

bp-isPhone

当设备是手机时生效.

1
2
3
4
@include bp-isPhone {
  // 指定其他样式.
  // ...
}

bp-isTablet

当设置是桌面或平板时生效.

1
2
3
4
@include bp-isTablet {
  // 指定其他样式.
  // ...
}

bp-isLandscape

当设备横屏时生效.

1
2
3
4
@include bp-isLandscape {
  // 指定其他样式.
  // ...
}

bp-isPortrait

当设备竖屏时生效.

1
2
3
4
@include bp-isPortrait {
  // 指定其他样式.
  // ...
}
← 0基础样式