웹솔루션개발 22년 노하우! 해피CGI의 모든것

[해피CGI][cgimall] 유튜브 썸네일 이미지 가져오기 본문

웹프로그램밍 자료실/HTML 자료

[해피CGI][cgimall] 유튜브 썸네일 이미지 가져오기

해피CGI윤실장 2023. 11. 22. 09:05

웹페이지를 제작하다보면 유튜브 영상을 삽입할때가 있습니다.
경우에 따라 썸네일을 보여주고 영상을 링크하는 경우도 있습니다.
이때 해당 유튜브 영상의 썸네일을 가져오는 방법에 대해 안내해 드립니다.


아래 영상의 썸네일을 가져온다고 할때

https://www.youtube.com/watch?v=ARTkK9h5nsI

ARTkK9h5nsI 부분이 영상의 고유ID 값입니다.
해당값을 아래 처럼 이미지 주소에 삽입합니다.

ARTkK9h5nsI/0.jpg">

위와 같이 할경우 이미지의 상하에 검은색 여백이 생기고 이미지의 비율도 맞지않습니다.





이미지 경로에 파일명을 변경하여 다른 썸네일을 불러올 수 있습니다.




0.jpg">

기본 이미지의 상하에 검은색 여백이 생깁니다.





mqdefault.jpg">

검은색 여백이 삭제됩니다.




maxresdefault.jpg">

검은색 여백이 삭제됩니다.
최대품질, 최대크기로 출력이 됩니다.

 

 

 

 

저작자표시

'웹프로그램밍 자료실 > HTML 자료' 카테고리의 다른 글

[해피CGI][cgimall] css로 만든 로딩 아이콘 애니메이션 효과  (0) 2023.12.27
[해피CGI][cgimall] CSS-only scroll-driven text highlights 스크롤시 텍스트 하이라이트 에니메이션  (0) 2023.11.23
[해피CGI][cgimall] CSS로 아이프레임 높이 자동 조절  (0) 2023.11.16
[해피CGI][cgimall] Text animation  (0) 2023.11.16
[해피CGI][cgimall] 범위를 표현하는 인풋 슬라이드 Range With Sliding Value  (0) 2023.11.06
공유하기 링크
'웹프로그램밍 자료실/HTML 자료' Related Articles more
Comments