BootStrap Flex31.html Flex Use flex classes to control the layout of Bootstrap 4 components. Flex container:d-flex d-flex로 배치(영역에 사용가능한 여백을 배분, 즉 아이템들의 정렬에 사용) Flex item 1 Flex item 2 Flex item 3 .row 및 .col로 배치(영역을 특정 비율로 분할하여 배치 시) Col 1 Item 1 Item 2 Item 3 col3 Flex Container:d-inline-flex Flex item 1 Flex item 2 Flex item 3 FLex Container:Horizontal Direction .flex-row Flex item 1 Flex item..

BootStrap Form Inputs23.html Form Inputs we use the .form-control class to style inputs with full-width and proper padding, etc Checkboxes Option 1 Option 2 Option 3 Inline Checkboxes Option 1 Option 2 Option 3 Select List Select list: 1 2 3 4 Form Control Sizing(세로폭) Form Control with Plain Text 결과) Custom Forms24.html Custom Forms Bootstrap 4 comes with customized form elements, that are meant..

BootStrap Dropdowns18.html Dropdowns A dropdown menu is a toggleable menu that allows the user to choose one value from a predefined list Basic Dropdown/Dropdown Divider/Dropdown Header/Disable and Active items 메뉴 게시판메뉴 공지사항 Q&A 자유게시판 회원메뉴 로그인 회원가입 Dropdown Position Dropright Link 1 Link 2 Link 3 Dropup Link 1 Link 2 Link 3 Dropleft Link 1 Link 2 Link 3 Dropdown Menu Right Wide dropdown button t..

BootStrap Images07.html Images Image Shapes:Rounded Corners,Circle,Thumbnail Image Shapes Aligning Images Left,Right Images Cetered Images Responsive Images Not Responsive Image Responsive Image Responsive Image for Image Shapes 결과) Alerts09.html Alerts Bootstrap 4 provides an easy way to create predefined alert messages: Alerts Success! This alert box could indicate a successful or positive act..

BootStrap Typography04.html Text/Typography Bootstrap 4 uses a default font-size of 16px, and its line-height is 1.5. The default font-family is "Helvetica Neue", Helvetica, Arial, sans-serif. In addition, all elements have margin-top: 0 and margin-bottom: 1rem (16px by default). h1 ~ h6 h1 Bootstrap heading (2.5rem = 40px) h2 Bootstrap heading (2rem = 32px) h3 Bootstrap heading (1.75rem = 2..

BootStrap 자바스크립트도 사용하는 Workspace폴더에 Bootstrap폴더 생성 (좌측 위쪽 File에서 Open Folder) 여기서 html코드 생성 boostrap폴더 생성 boostrap폴더 생성/아래 css폴더와 js폴더 생성 css폴더 아래 2개 파일 복사 붙여 넣기 js폴더 아래 6개 파일 복사 붙여 넣기 Template.html 템플릿 제목 요약 설명부분입니다 결과) GetStared01.html My First Bootstrap Page Resize this responsive page to see the effect! 결과) Containers02.html Responsive Fixed Container My First Bootstrap Page This is some tex..