컴퓨터는 잘못이 없다..

하다맘!! [bootstrap.css파일]

[반응형 칼럼] -총 화면을 12칸으로 나누어 조절하므로 col 맨 뒤에 붙는 숫자는 1~12까지 있음 -화면크기는 총 5개로 구분 화면 크기 → Extra Small =576px Medium >=768 Large >=992 Extra Large >=1200px col-1~12 / 모든 영역에 대해 적용 (화면크기가 아무리 커도(Extra Large이상) 아무리 작아도(Extra small이하) 지정 수만큼 차지) col-sm-1 ~ 12 / 화면크기가 small 이상일 때 1~12칸 중 지정숫자만큼 차지 (화면 크기가 small 아래로 내려가면 col-sm뒤에 붙는 지정 수와 상관없이 폭100%를 차지함) col-md-1 ~ 12 / 화면크기가 medium 이상일 때 1~12칸 중 지정숫자만큼 차지 (..

[Grid System이란?] Bootstrap에는 12개의 칼럼으로 나누어서 기능을 제공한다. 테이블을 자유자재로 만들 듯 row클래스와, col-* 클래스들로 자유롭게 구성이 가능하다. 이렇게 구성한 페이지들은 Bootstrap에서 알아서 크기에 따라 반응형으로 동작한다. [쓰는 방법 예] 칼럼1 칼럼2 칼럼1 칼럼2 칼럼3 *위 코드 col 자리에 col-(sm~xl)-*가 들어가며 *에는 1~12까지의 수가 들어간다. (13개 이상이면 흘러내린다.) *위 코드처럼 col만 써준다면 화면 크기를 같은 비율로 나눠 차지한다.(칼럼이 3개면 1:1:1비율) *또한 col만 써준다면 col클래스 요소가 13개 이상이어도 나눠 차지한다 그리고 흘러내리지 않음! *또한 col-(sm~xl) 뒤에 숫자를 써주..

[반응형 레이아웃] 화면 크기(폭)에 따라 레이아웃이 바뀌는 것을 반응형 레이아웃이라고 한다. [화면크기에 따른 폭 정하기] -길이는 스크롤바를 이용하면 되지만 폭은 화면 크기에 맞게 만들어야함. 이에 대한 가이드라인을 부트스트랩 홈페이지에서 정해주었다. (홈페이지-get started-layout) (홈페이지에서는 촘촘하게 나누어주었지만 이 기준을 내가 정해서 만들어주면 된다!) -화면 크기에 따라 레이아웃을 다르게 만들어줄 수 있는데 화면 크기가 extra small ~ extra large까지 나누어져 있고, 화면 크기에 따라 요소들이 차지하는 폭이 달라진다. .container-sm | .container-md. | container-lg. | container-xl. → 이 용어에 익숙해지기 -..

[화면에 따른 사이즈] 길이는 스크롤바를 이용하면 되지만 폭은 비율에 맞게 만들어야함. 이에 대한 가이드라인을 부트스트랩 홈페이지에서 정해주었다. 촘촘하게 나누어주었지만 이 기준을 내가 정해서 만들어주면 된다! 따라서 폭에 따라 레이아웃을 다르게 만들어줄 수 있는데 화면 size에 따라 extra small ~ extra large까지 나누어져 있다. .container-sm | .container-md. | container-lg. | container-xl. → 이 용어에 익숙해지기 [예제코드] container-sm container-md container-lg container-xl container-fluid [코드결과]

[Bootstrap CSS를 사용하는 방법2가지] 1. 복사해서 사용 2. 다운로드 받아서 사용 (두 방법 모두 버전을 확인하고 넣을 것) [1. Bootstrap CSS 복사해서 사용하는 방법] 홈페이지 들어가서 - getStarted - css에 해당하는 코드 copy 후 head에 복사하면 사용할 수 있음 참고) 예전 웹브라우저는 부트스트랩4가 먹지 않음, 예전 웹브라우저에 적용시키고 싶으면 부트스트랩3을 쓸 것! getbootstrap.com/ Bootstrap The most popular HTML, CSS, and JS library in the world. getbootstrap.com ▼버전은 오른쪽 상단에서 선택 가능하다. [2. 부트스트랩 CSS 다운로드 받아서 사용하기] 다운로드 받은..