1234567891011121314151617181920212223242526272829303132333435363738 |
- .safe-area-top {
- width: 100%;
- padding-top: constant(safe-area-inset-top); /* 兼容 iOS < 11.2 */
- padding-top: env(safe-area-inset-top); /* 兼容 iOS >= 11.2 */
- }
- .safe-area-bottom {
- width: 100%;
- padding-bottom: constant(safe-area-inset-bottom); /* 兼容 iOS < 11.2 */
- padding-bottom: env(safe-area-inset-bottom); /* 兼容 iOS >= 11.2 */
- }
- .safe-area-left {
- width: 100%;
- padding-left: constant(safe-area-inset-left); /* 兼容 iOS < 11.2 */
- padding-left: env(safe-area-inset-left); /* 兼容 iOS >= 11.2 */
- }
- .safe-area-right {
- width: 100%;
- padding-right: constant(safe-area-inset-right); /* 兼容 iOS < 11.2 */
- padding-right: env(safe-area-inset-right); /* 兼容 iOS >= 11.2 */
- }
- .safe-area-all {
- width: 100%;
- padding-top: constant(safe-area-inset-top);
- padding-right: constant(safe-area-inset-right);
- padding-bottom: constant(safe-area-inset-bottom);
- padding-left: constant(safe-area-inset-left);
- padding-top: env(safe-area-inset-top);
- padding-right: env(safe-area-inset-right);
- padding-bottom: env(safe-area-inset-bottom);
- padding-left: env(safe-area-inset-left);
- }
|