이미지 또는 비디오 위에 아이콘 배치

문제:
이미지 또는 비디오 위에 아이콘을 배치해야 합니다. 이미지 또는 비디오를 왼쪽 하단 모서리에 정렬합니다. 아이콘을 클릭하면 이미지에 대한 다운로드 프롬프트가 실행됩니다.

해결책:
원하는 위치를 지정하려면 이미지 주위에 상대 컨테이너를 만들어야 합니다. 그런 다음 아이콘 위치를 절대 위치로 설정합니다. 다음은 코드 예입니다.

.container {
  position: relative;
}

.container img {
  display: block;
}

.container .fa-download {
  position: absolute;
  bottom: 0;
  left: 0;
}

Bootstrap 3 Font-Awesome:
예, Bootstrap 3 Font-Awesome에도 동일한 방법이 적용됩니다. 위 코드의 Font Awesome 버전을 다음으로 바꿉니다.