跳转到内容

响应式 UI

Material Design 布局鼓励通过使用统一的元素和间距来实现跨平台、跨环境、不同屏幕尺寸下的一致性。

Material Design 中的 响应式布局 可适配任何可能的屏幕尺寸。 我们提供以下工具以实现响应式 UI:

  • Grid: The Material Design responsive layout grid adapts to screen size and orientation, ensuring consistency across layouts.
  • Container: The container centers your content horizontally. 这是最基本的布局元素。
  • Breakpoints: API that enables the use of breakpoints in a wide variety of contexts.
  • useMediaQuery: This is a CSS media query hook for React. 它监听与 CSS 媒体查询的匹配的内容。