[web] BS - Material Design 반응형 그리드 레이아웃 분기점 (Breakpoint)

4,146

https://material.io/design/layout/responsive-layout-grid.html#breakpoi… (3271)

Material Design 반응형 그리드 레이아웃

Breakpoint Range (dp)	Portrait	Landscape	Window	Columns	Margins / Gutters*
0 – 359	small handset		xsmall	4	16
360 – 399	medium handset		xsmall	4	16
400 – 479	large handset		xsmall	4	16
480 – 599	large handset	small handset	xsmall	4	16
600 – 719	small tablet	medium handset	small	8	16
720 – 839	large tablet	large handset	small	8	24
840 – 959	large tablet	large handset	small	12	24
960 – 1023		small tablet	small	12	24
1024 – 1279		large tablet	medium	12	24
1280 – 1439		large tablet	medium	12	24
1440 – 1599			large	12	24
1600 – 1919			large	12	24
1920 +			xlarge	12	24

★ Margins (바깥여백) and gutters (열 간격)은 유동적이라 같은 사이즈일 필요 없음.
★ IOS 기기는 약간 다르니, 위 링크 가셔서 확인.

코멘트입력

검색목록 목록 글쓰기


분류	제목



web	자주 쓰는 특수문자 입력법

web	PHP - write_update.php 등 업데이트 파일 에러 확인 방법

web	구글에 웹문서 노출 많이 되게 하는 법 (=구글에 웹페이지 검색 잘되게 하는 법) 1

web	커널, 쉘, SSH, 콘솔, 터미널 개념 구분 + 사용중인 쉘종류 확인

web	스킨, 테마, 빌더, 플러그인, 코어 차이점 (= 개념비교) 1

web	카페24 PhpMyAdmin 설치법 + (대체・대용) DB 관리 프로그램 설문 중

web	특수 기호 입력법 + 특수 기호 목록표

web	본인 도메인 이메일 갖기 : 네이버 이메일 MX 설정법 (works.naver.com 이용법)

web	코드 작성 팁 (주의사항)

web	트래픽 아끼는 법 3 - robots.txt 작성법 + 웹로봇 방문 주기 지정 (crawl 크롤 횟수 지정 …

web	링크 모음 사이트 장단점 (=시작페이지 사이트 제작시 유의 사항)

web	192.243.55.xxx 아이피 (= SemrushBot 검색로봇)

web	나모, 드림위버, 메모장으로 EUC-KR, UTF-8 형식으로 저장하는 법

web	트래픽 아끼는 법 1 - robots.txt 파일을 사용하여 구글 로봇 페이지 차단 또는 삭제

web	핑 테스트로 도메인 서버 아이피 알아내기 (= 핑테스트 Ping, Domain, IP 확인)

web	홈페이지 제작 필수 요소 - 빌더 (홈페이지 소스), 호스팅 (서버), FTP, 도메인

web	홈페이지 제작에 꼭 필요한 것들 - 빌더, 호스팅 (서버), FTP, 도메인

web	십진법 (=십진수) , 이진법(= 이진수) 개념 및 변환

web	swp 확장자 파일 생성 원인과 읽는 법

web	코드정리기 (= 소스정리기 code beautifier) + JS압축기

16/19

[web] BS - Material Design 반응형 그리드 레이아웃 분기점 (Breakpoint)

공지사항

최신글

최신댓글

운영비 후원해주신 분 리스트