유튜브 영상 삽입 - 바로 실행해보면서 배우는 HTML5/CSS3
바로 실행해보면서 배우는 HTML5/CSS3
  • 유튜브 영상 삽입
    learn
    Practice
    learn
    06 멀티미디어 관련 태그
    유튜브 영상 삽입

    <audio> 태그나 <video> 태그는 특별한 상황이 아니고서는 자주 쓰이지 않습니다. 대신, 우리가 자주 보는 유튜브 영상을 내가 만든 페이지에 넣는 방법에 대해 간단히 살펴보려 합니다.

    유튜브 영상을 넣는 방법은 간단합니다. 먼저 유튜브 영상 아래에 공유하기를 클릭합니다.

    공유창이 뜨면 HTML 코드를 제공하는 < >퍼가기를 클릭합니다.

    동영상 퍼갈 수 있는 HTML 소스 코드가 뜨면 이를 복사하여 아래와 같이 붙여넣습니다. 오른쪽 실습 창에서 직접 아래 코드를 붙여넣어 봅시다.

    여기서 src의 속성 값인 URL을 살펴보면, /embed/뒤에 영어와 숫자를 조합한 Youtube 영상 ID를 볼 수 있습니다. 이 영상 ID는 모든 유튜브 영상의 주소 URL을 보면 찾을 수 있으며, 이 영상 ID를 바꿔줌으로써 원하는 영상으로 변경할 수 있습니다.

    마지막으로 유튜브 영상을 추가할 때 쓰는 <iframe>태그는 유튜브 영상 뿐만 아니라 웹 페이지를 삽입할 때도 사용됩니다.

    Practice

    유튜브 영상을 웹 페이지에 가져와 출력해봅시다.

    learn
    Practice
    Q & A
    Q&A forum that anyone can ask and answer.
    Share your questions and answers with other students and grow together!
    Registered Questions(0)