부트스트랩 CSS 이미지 참조
부트스트랩 이미지
둥근 모서리:
원:
썸네일:
<img> 클래스
아래 클래스를 사용하여 모든 이미지의 스타일을 지정할 수 있습니다.
| Class | Description | Example |
|---|---|---|
| .img-rounded | Adds rounded corners to an image (not available in IE8) | |
| .img-circle | Shapes the image to a circle (not available in IE8) | |
| .img-thumbnail | Shapes the image to a thumbnail | |
| .img-responsive | Makes an image responsive (will scale nicely to the parent element) |
반응형 이미지
태그 에 .img-responsive클래스를 추가하여 반응형 이미지를 만듭니다 . <img>그러면 이미지가 상위 요소에 맞게 조정됩니다.
.img-responsive클래스는 max-width: 100%, height: auto및 display:block이미지에 적용됩니다 .
예시
<img src="cinqueterre.jpg" class="img-responsive" alt="Cinque Terre">