(공부) 부트스트랩이란?

▶  부트스트랩 (= 프레임워크) / 반응형

:  웹사이트를 쉽게 만들 수 있게 도와주는 html, css, js가 내포된 프레임워크로 하나의 css로 모바일, 태블릿, 데스크탑까지 다양한 기능을 제공하고 있으며 쉽게 웹사이트를 제작 및 유지할 수 있게 도와준다.

사용방법  /  기본제공되어지는 css, js 등의 외부파일들을 필수로 연결!

= 링크를 이용하거나 해당하는 파일을 다운받아서 연결해주어 사용 가능함

구조와 그리드 시스템!

▶  그리드 시스탬( 12 )

:  레이아웃을 만들기 위한 규격으로 단을 나눈어 레이아웃을 조금 더 쉽게 짜기 위한 형태 반응형을 더 쉽게 짜기 위해 사용!  12단의 그리드 내에서 셀이 분배되어짐

 

▶ 그리드의 법칙

-  컬럼은 12개 내에서 존재해야함 12개이상의 컹엄이 생성 될 경우 자동으로 밑으로 내려감

-  컨테이너(container)라는 큰 부모박스 밑에 개별 컬럼이 존재해야 함!

  :  개별칼럼은 항상 컨테이너의 자식 개체여야한다는 뜻!

-  행은( row )는 컬럼만 담고 있어야함

-  행은( row )는 container(컨테이너)라는 부모박스안에 배치 되어야함

 

▶  구조순서

container  >  row  >  col

1.  container( 1200준하는 사이즈 △ ▽ )

:  고정된 좌우너비를 화면상에서 가지며, 자동으로 박스가 화면상 중심배치 제일 상단 부모박스로 사용

  다른요소를 포함 가능!  row뿐 아닌~

2.  row( 행 )

:  container(컨테이너) 안에 존재  +  자식요소 col을 배치

3.  col( 열, 내용물을 넣는 실질적인 공간 )

:  12단을 만들면서 레이아웃 표현  row안에 존재가능