safe-area.wxss 1.1 KB

1234567891011121314151617181920212223242526272829303132333435363738
  1. .safe-area-top {
  2. width: 100%;
  3. padding-top: constant(safe-area-inset-top); /* 兼容 iOS < 11.2 */
  4. padding-top: env(safe-area-inset-top); /* 兼容 iOS >= 11.2 */
  5. }
  6. .safe-area-bottom {
  7. width: 100%;
  8. padding-bottom: constant(safe-area-inset-bottom); /* 兼容 iOS < 11.2 */
  9. padding-bottom: env(safe-area-inset-bottom); /* 兼容 iOS >= 11.2 */
  10. }
  11. .safe-area-left {
  12. width: 100%;
  13. padding-left: constant(safe-area-inset-left); /* 兼容 iOS < 11.2 */
  14. padding-left: env(safe-area-inset-left); /* 兼容 iOS >= 11.2 */
  15. }
  16. .safe-area-right {
  17. width: 100%;
  18. padding-right: constant(safe-area-inset-right); /* 兼容 iOS < 11.2 */
  19. padding-right: env(safe-area-inset-right); /* 兼容 iOS >= 11.2 */
  20. }
  21. .safe-area-all {
  22. width: 100%;
  23. padding-top: constant(safe-area-inset-top);
  24. padding-right: constant(safe-area-inset-right);
  25. padding-bottom: constant(safe-area-inset-bottom);
  26. padding-left: constant(safe-area-inset-left);
  27. padding-top: env(safe-area-inset-top);
  28. padding-right: env(safe-area-inset-right);
  29. padding-bottom: env(safe-area-inset-bottom);
  30. padding-left: env(safe-area-inset-left);
  31. }