BootStrap

대중적으로 많이 사용하고 유명한 CSS 프레임 워크.반응형 웹 사이트를 빠르게 만들 수 있게 작업을 도와줍니다. CSS 언어의 사용량을 줄일 수 있다.부트스트랩은 온갖 웹 사이트에 대한 프레임워크 & 시작점을 제공한다.프레임워크 어떠한 것을 만들기 전에 계획하는 틀

부트스트랩에서 제공하는 다양한 태그 중에서 Button태그로 어떤 식으로 부트스트랩을이용하는지 살펴보겠습니다.참고로 부트스트랩에서 가져와서 사용한 클래스들에 대한 CSS도 수정할 수 있습니다.btn-primary라는 클래스에 대한 색상을 파랑이 아닌, 다른 색으로도 변

부트스트랩에서 배지에 관한 프레임워크를 사용해보겠습니다.배지를 사용하면 좋은 점은, 네비게이션이나 버튼에 포인트를 줘서 정확한 의미를 전달하는데용이합니다.부트스트랩 사이트에서 Componets > Badge 카테고리 클릭버튼들을 한 그룹으로 모아둔 프레임 워크 부트스트

레이아웃을 수정할 때 사용하는 요소 입니다.flex 처럼 공간을 분배해서 사용할 수 있고, 반응형 웹 사이트에 주로 사용 됩니다.부트스트랩 그리드 프레임워크를 사용하려면 최소 1개의 컨테이너 클래스가 존재해야 한다.컨테이너 안에 컨테이너를 중첩시킬 수 있다.class=

부트스트랩은 flex-box 기반으로 만들어졌기 때문에, flex-box에서 사용하는정렬 기능을 사용할 수 있습니다..

부트스트랩에서 input select textarea 같은 입력요소들에 대한 스타일이포함되어있는 프레임워크 입니다.

네비게이션에 관한 프레임워크를 사용해서 반응형 네비게이션 바를 만들 수 있습니다.

부트스트랩에서 아이콘을 사용하는 방법을 알아보겠습니다.부트스트랩 사이트 > 네비게이션 바에 있는 Icon 클릭SVG 태그를 사용하여 단순 이미지와는 다르게 부모요소에 따라 아이콘의 크기나 색상이변화할 수 있습니다.Font Awesome다양한 무료 아이콘이 방대하게 존재

테두리, 색상, 그림자, 텍스트 등등 CSS가 적용된 프레임워크의 집합체Document > Utilies

다양한 변형과 옵션이 존재하는 유연하고 확장가능한 컨테이너를 제공하는프레임워크 입니다.썸네일, 머리글 및 바닥글에 대한 설명이 들어가는 컨테이너입니다.그리드와 같이 사용됩니다.이미지나 컨텐츠를 슬라이드형식으로 보여주는 프레임워크 자바스크립트로 작동한다.단일 페이지에 여

부트스트랩을 활용해서 하나의 반응형 웹 사이트를 제작해보겠습니다.

이전에는 네비게이션바에 대한 작업을 했고, 이번 포스팅에서는 컨텐츠 요소들을 반응형에따라서 변화되게 미디어쿼리를 적용 해보겠습니다.컨테이너와 fluid 컨테이너의 차이점은 일반적인 컨테이너는 중단점에 따라서 컨테이너의크기가 변하는데, fluid 같은 경우에는 어떤 중단

이전 포스팅에 이어서 2번째 섹션에 대해서 부트스트랩을 사용해보겠습니다.

이전 포스팅에 이어서 마지막 섹션 작업을 시작하겠습니다.저는 본문의 배치를 3개의 섹션으로 나눠서 진행 했지만, 하나의 섹션 안에서 모든 이미지와문단 부분을 포함해도 동일한 결과를 나타냅니다.