개발자의 낙원

  • 홈
  • 태그
  • 방명록

responsive 1

부트스트랩의 Grid(그리드) 레이아웃, +@container(컨테이너), breakpoint(브레이크포인트)

Grid(그리드)? 평행선과 수평선으로 이루어진 격자구조의 요소. 일반적으로 row(행): 가로줄과 column(열): 세로줄로 구성된다. 구글 크롬 시작화면의 웹페이지 아이콘 링크들도 일종의 그리드 배치로 볼 수 있다. ( HTML 소스는 안 까봐서 저게 실질적인 어떤 라이브러리의 그리드 구조인지는 모른다.) 부트스트랩에서는 responsive(반응성이 있는) 그리드를 제공해 준다. 이 말은 웹페이지 방문자가 사용 중인 기기의 화면크기, 혹은 브라우저의 크기에 반응하여 요소들의 배치가 자동으로 번경됨을 뜻한다. 크롬을 통해 예시를 살펴보자 크롬브라우저의 가로길이를 늘리자, 한 행에 배치되어 있는 아이콘의 개수가 3개에서 5개로 늘었다. 부트스트랩이 반응하는 화면 사이즈 표 출처 : 부트스트랩 그리드 d..

it공부 (개념)/HTML, CSS 2023.01.07
이전
1
다음
더보기
  • 분류 전체보기 (105)
    • 코딩테스트 (4)
      • 완전탐색 (1)
    • 수학 (1)
    • 프로젝트 기록 및 회고 (1)
      • 노마드10주 스터디 (11)
      • 고객관리 프로그램 (2)
    • it공부 (개념) (62)
      • javascript (27)
      • python (3)
      • 뻘글 (6)
      • 자료구조와 알고리즘 그리고 파이썬 (3)
      • HTML, CSS (12)
      • 웹 (4)
      • 디자인 패턴 (0)
    • 기타 (5)
    • it공부 (이야기) (8)
      • 리팩터링 (1)
      • 이런저런이야기 (1)
      • 버그픽스 (1)
    • CS공부(개념) (9)
      • 컴퓨터구조론 (1)
      • 독후감 (7)
    • 소프트스킬: 대인관계 (2)
      • 성찰 (2)

최근글과 인기글

  • 최근글
  • 인기글

Calendar

«   2026/02   »
일 월 화 수 목 금 토
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28

방문자수Total

  • Today :
  • Yesterday :

Copyright © Kakao Corp. All rights reserved.

티스토리툴바