bootstrap 반응형 기본 이론 2

1. jsp 또는 html에서 .container 를 적고

자동 완성을 이용하면 자동으로

<div class="container"> 코드가 완성된다.

​

2. offset-md-4 라는 클래스를 사용하면

부트스트랩 기준 4칸을 띄울 수있다.

​

3. 화면을 만들때 앞뒤의 여백이 기본적으로 생기게 되는데 이를 지우고 싶으면 .container가 아닌 .container-fluid 를 사용하면된다.

​

4. 코드를 작성할때 .col-md-4*3 과 같이

작성하면 자동으로 다음과 같은 코드가 만들어 진다.

<div class="col-md-4"></div> <div class="col-md-4"></div> <div class="col-md-4"></div>

5. 이미지를 넣을때 이미지의 크기가 너무 크면

옆의 영역을 침범할 수 있다.

그럴때는 다음과 같이 처리 할 수 있다.

<img src=" " alt="" class="img-fluid">

"img-fluid"를 넣으면 이미지가 지정된 칸 만큼 차지하게 되어 영역을 침범하지 않는다.

​

6. "rounded"를 넣으면 이미지의 모서리가 조금 둥글어진다.

​

7. "rounded-circle"을 이용하면 이미지를 둥글게 만들 수 있다.

​

​

​