부트스트랩은 반응형 웹 디자인을 위한 무료 프레임워크 정도로 이해하면 되겠다. 부트스트랩은 두 가지 방식으로 사용이 가능하다 첫번째, 부트스트랩을 다운로드하기. 두번째, CDN을 코드에 추가하기. 부트스트랩 다운로드는 여기에서 가능하다. CDN 추가 방식은 다음과
부트스트랩은 디폴트 폰트사이즈를 1rem(16px)로 하고, 라인의 높이는 1.5로 한다.덧붙여서, <p>는 margin-top을 0으로 갖고, margin-bottom을 1rem(16px)로 갖는다.부트스트랩에서는 HTML에서와 같이 <h1>~<h6>
부트스트랩에는 작은 패딩값을 가지고 수평으로 나누는 테이블이 있다.이와 같이 작성한다.줄무늬 형식의 테이블을 만드려면 다음과 같이 한다.테이블과 셀의 모든 면에 테두리를 추가하기 위해서는 다음과 같이 한다.hover시 효과를 주기 위해서는 다음과 같이 한다.테이블에 검
이미지를 첨부할때, 이미지 모양에는 세 종류가 있다 : rounded, circle, thumbnail 다음은 rounded로 이미지 모양을 지정하는 방식이다. circle로 이미지 모양을 지정하려면 다음과 같이 한다. Thumbnail형식도 마찬가지다. 왼쪽,
부트스트랩에는 다양한 형태의 버튼이 존재한다. 버튼의 색은 이전에 공부했던 색깔과 동일하다. .png) 버튼 클래스는 <a>, <button>, <input>에서 사용될 수 있다. button-outline은 hover 효과를 위한 것이다.
많은 페이지를 가진 사이트를 만들때, 부트스트랩을 이용해 pagination을 만들 수 있다.pagination을 만들때, 다음과 같이 하면 된다.현재 페이지에 하이라이트를 주려면 active를 이용한다.누를 수 없는 버튼을 작성하려면 다음과 같이하면 된다. 아마 첫페
드롭다운은 다음과 같이 구성하면 된다. 먼저 dropdown클래스를 만들고, 그 안에 토글버튼을 만든다. 그 뒤 정렬되지 않은 리스트로 dropdown 메뉴를 만든다.드롭다운 디바이더를 이용하면 수평 border를 이용해 드롭다운 메뉴를 나눌 수 있다.드롭다운 헤더를
부트스트랩을 사용하면 네비게이션 막대가 확장되거나 축소될 수 있다.기본적인 네비게이션 막대는 navbar클래스와 함께 만들어진다. 반응형은 navbar-expand-xxl|xl|lg|md|sm 를 통해 만들 수 있다. navbar에 링크를 넣기 위해서는 ul나 div를
Modal컴포넌트는 현재 페이지의 top에 배치되는 다이얼로그 박스(팝업 윈도우)다.먼저 컨네이너에 버튼을 생성하고, modal에 아이디를 주고 modal을 생성해준다.modal fade를 사용하면 fade효과를 줄 수 있다.modal의 크기도 조정할 수 있는데위와 같