Material UI의 그리드 컴포넌트 대신 CSS 그리드를 사용할 수 있습니까?

에릭 크레시 오니

재료 - UI 그리드 구성 요소 인 flexbox에 따라 아주 잘 작동합니다. 그러나 사용하기 쉬운 CSS 그리드와 비교하여 이점이 있는지 이해하려고합니다. 나는 실제로 CSS 그리드를 선호하지만 그것을 사용하여 나머지 시스템을 깨뜨리고 싶지는 않습니다. 어떤 식 으로든 머티리얼 UI의 나머지 부분을 방해합니까?

통찰력이 있습니까? 미리 감사드립니다.

라이언 코그 스웰

그리드 구성 요소가 제공하는 주요 이점 (플렉스 박스를 직접 사용하는 것과 비교)은 다양한 화면 너비에 대해 그리드 열 수를 쉽게 조정할 수있는 테마 기반 중단 점 소품 (xs, sm, md 등)의 편리함입니다. CSS Grid를 선호하거나 (IE 11을 지원하지 않으려는 경우) flexbox를 직접 사용하는 경우에는 사용하지 않을 이유가 없습니다. Material-UI의 어떤 것도 그리드 구성 요소를 사용하는지 여부에 대해 신경 쓰지 않습니다.

내 응용 프로그램에서 Material-UI의 Grid구성 요소가 원하는 레이아웃을 쉽게 제공하고 계속해서 사용하는 경우가 Grid많으며 방해 가되는 다른 경우 가 있으며 Flexbox CSS를 직접 사용합니다 (현재로서는, 우리 앱은 여전히 ​​IE 11을 지원하므로 CSS Grid를 사용하지 않습니다. 앞으로 지원되는 브라우저를 변경하여 CSS Grid를 사용할 수 있기를 기대합니다.)

이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.

침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제

에서 수정
0

몇 마디 만하겠습니다

0리뷰
로그인참여 후 검토

관련 기사

분류에서Dev

머티리얼 UI : 미리 정의 된 셀 유형 ( 'string', 'number', 'date', 'dateTime') 대신 DataGrid 셀에서 React 컴포넌트를 사용할 수 있습니까?

분류에서Dev

컴포넌트 다이어그램의 모듈 간 통신에서 인터페이스를 어떻게 사용할 수 있습니까?

분류에서Dev

열 수를 변경하면서 Material-UI의 그리드를 래핑하는 코드를 어떻게 재사용 할 수 있습니까?

분류에서Dev

QML StackLayout이 외부 컴포넌트의 드래그를 감지 할 수 있습니까?

분류에서Dev

Angular Material : '부모 요소'가 접근 할 수있는 컴포넌트를 만드시겠습니까?

분류에서Dev

머티리얼 UI 컴포넌트에 대한 가져 오기를 더 짧게 만들 수 있습니까?

분류에서Dev

iBeacons 대신 CoreBluetooth를 사용하여 백그라운드에서 거리를 측정 할 수 있습니까?

분류에서Dev

ReactJS에서 단일 컴포넌트에 대한 Materialise CSS를 방지 할 수 있습니까?

분류에서Dev

React에서 클래스 컴포넌트 내부에 메소드를 어떻게 정의 할 수 있습니까?

분류에서Dev

뷰에서 컴포넌트의 메소드를 어떻게 호출 할 수 있습니까? (vue.js 2)

분류에서Dev

버튼 클릭을 요구하는 대신이 React 컴포넌트를로드 할 때이 함수를 트리거하는 방법은 무엇입니까?

분류에서Dev

Material UI <Menu> 컴포넌트에 <Hidden> 메뉴 항목을 포함 할 수 있습니까?

분류에서Dev

Angular에서 컴포넌트를로드 할 수 없습니까?

분류에서Dev

document.getElementsByClassName ()을 사용하여 React 컴포넌트를 처리 할 수 있습니까?

분류에서Dev

React 컴포넌트에서 부울 상태를 분리 할 수 있습니까?

분류에서Dev

모든 Angular 컴포넌트 ngAfterViewInit 메소드에 대한 로직을 구현할 수 있습니까?

분류에서Dev

표준 JFace 트리 대신 Eclipse 플러그인 개발에서 JTree를 사용할 수 있습니까?

분류에서Dev

Android에서 좋은 컴포넌트 (Dagger) 리스너를 어떻게 빌드 할 수 있습니까?

분류에서Dev

React 컴포넌트의 리턴 기능에서 외부 HTML을 설정할 수 있습니까?

분류에서Dev

react material-ui 필드 사이의 수평 거리를 어떻게 설정할 수 있습니까?

분류에서Dev

CSS 그리드의 마지막 열을 선택할 수 있습니까?

분류에서Dev

그래픽 처리를 네트워크의 다른 컴퓨터로 오프로드 할 수 있습니까?

분류에서Dev

AngularJS 1.6의 속성으로 요소에 컴포넌트를 사용할 수 있습니까?

분류에서Dev

커스텀 컴포넌트 내에서 낙타 컴포넌트를 사용할 수 있습니까?

분류에서Dev

Material-UI의 Select 컴포넌트는 닫을 때 setTimeout을 사용합니까? 그렇다면 그 이유는 무엇입니까?

분류에서Dev

마더 보드의 HDMI 포트를 그래픽 카드 HDMI 포트와 함께 사용할 수 있습니까?

분류에서Dev

마우스를 올리는 대신 드래그 즉시 Splitter의 크기를 조정할 수있는 방법이 있습니까?

분류에서Dev

Material UI Menu 컴포넌트를 오른쪽 대신 왼쪽으로 여는 방법은 무엇입니까?

분류에서Dev

컴포넌트를 다른 컴포넌트로 제어 할 수 있도록 만드는 Reactjs 모범 사례?

Related 관련 기사

  1. 1

    머티리얼 UI : 미리 정의 된 셀 유형 ( 'string', 'number', 'date', 'dateTime') 대신 DataGrid 셀에서 React 컴포넌트를 사용할 수 있습니까?

  2. 2

    컴포넌트 다이어그램의 모듈 간 통신에서 인터페이스를 어떻게 사용할 수 있습니까?

  3. 3

    열 수를 변경하면서 Material-UI의 그리드를 래핑하는 코드를 어떻게 재사용 할 수 있습니까?

  4. 4

    QML StackLayout이 외부 컴포넌트의 드래그를 감지 할 수 있습니까?

  5. 5

    Angular Material : '부모 요소'가 접근 할 수있는 컴포넌트를 만드시겠습니까?

  6. 6

    머티리얼 UI 컴포넌트에 대한 가져 오기를 더 짧게 만들 수 있습니까?

  7. 7

    iBeacons 대신 CoreBluetooth를 사용하여 백그라운드에서 거리를 측정 할 수 있습니까?

  8. 8

    ReactJS에서 단일 컴포넌트에 대한 Materialise CSS를 방지 할 수 있습니까?

  9. 9

    React에서 클래스 컴포넌트 내부에 메소드를 어떻게 정의 할 수 있습니까?

  10. 10

    뷰에서 컴포넌트의 메소드를 어떻게 호출 할 수 있습니까? (vue.js 2)

  11. 11

    버튼 클릭을 요구하는 대신이 React 컴포넌트를로드 할 때이 함수를 트리거하는 방법은 무엇입니까?

  12. 12

    Material UI <Menu> 컴포넌트에 <Hidden> 메뉴 항목을 포함 할 수 있습니까?

  13. 13

    Angular에서 컴포넌트를로드 할 수 없습니까?

  14. 14

    document.getElementsByClassName ()을 사용하여 React 컴포넌트를 처리 할 수 있습니까?

  15. 15

    React 컴포넌트에서 부울 상태를 분리 할 수 있습니까?

  16. 16

    모든 Angular 컴포넌트 ngAfterViewInit 메소드에 대한 로직을 구현할 수 있습니까?

  17. 17

    표준 JFace 트리 대신 Eclipse 플러그인 개발에서 JTree를 사용할 수 있습니까?

  18. 18

    Android에서 좋은 컴포넌트 (Dagger) 리스너를 어떻게 빌드 할 수 있습니까?

  19. 19

    React 컴포넌트의 리턴 기능에서 외부 HTML을 설정할 수 있습니까?

  20. 20

    react material-ui 필드 사이의 수평 거리를 어떻게 설정할 수 있습니까?

  21. 21

    CSS 그리드의 마지막 열을 선택할 수 있습니까?

  22. 22

    그래픽 처리를 네트워크의 다른 컴퓨터로 오프로드 할 수 있습니까?

  23. 23

    AngularJS 1.6의 속성으로 요소에 컴포넌트를 사용할 수 있습니까?

  24. 24

    커스텀 컴포넌트 내에서 낙타 컴포넌트를 사용할 수 있습니까?

  25. 25

    Material-UI의 Select 컴포넌트는 닫을 때 setTimeout을 사용합니까? 그렇다면 그 이유는 무엇입니까?

  26. 26

    마더 보드의 HDMI 포트를 그래픽 카드 HDMI 포트와 함께 사용할 수 있습니까?

  27. 27

    마우스를 올리는 대신 드래그 즉시 Splitter의 크기를 조정할 수있는 방법이 있습니까?

  28. 28

    Material UI Menu 컴포넌트를 오른쪽 대신 왼쪽으로 여는 방법은 무엇입니까?

  29. 29

    컴포넌트를 다른 컴포넌트로 제어 할 수 있도록 만드는 Reactjs 모범 사례?

뜨겁다태그

보관