1. 반응형 이미지

부트스트랩을 이용하면 이미지의 반응형을 위해 클래스 하나 추가하면 됩니다.

<img src="..." class="img-responsive" alt="Responsive image">

2. 반응형 비디오

동영상을 위한 반응형 처리는 아래와 같은 구조입니다.

<!-- 16:9 aspect ratio -->
<div class="embed-responsive embed-responsive-16by9">
  <iframe class="embed-responsive-item" src="..."></iframe>
</div>

<!-- 4:3 aspect ratio -->
<div class="embed-responsive embed-responsive-4by3">
  <iframe class="embed-responsive-item" src="..."></iframe>
</div>

3. 페이지 경로

부트스트랩 페이지에서 컴포넌트와 js메뉴를 확인해 보면 원하는 대부분을 얻을 수 있습니다.

<ol class="breadcrumb">
  <li><a href="#">Home</a></li>
  <li><a href="#">Library</a></li>
  <li class="active">Data</li>
</ol>

4. 부트스트랩 미디어쿼리

부트스트랩에서 사용하고 있는 그리드 및 미디어쿼리 Breakpoint를 확인하여 개별 프로젝트에 필요한 작업을 추가할 수 있습니다.

https://getbootstrap.com/docs/3.3/css/#grid