반응형
# 결과
- 재생가능.
# 예제소스
- <iframe> 으로 동영상 링크를 입력하여 웹페이지에 삽입.
- width, height, title 등 옵션 수정 가능
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title>Website List</title>
</head>
<body>
<h1><u>Example : Video</u></h1>
<h2>for study</h2>
<iframe width="640" height="480" src="https://www.youtube.com/embed/Pk0tYY_qCYY" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</body>
</html>
# 동영상 소스 코드 가져오는 방법
- 유튜브 또는 영상사이트에서 영상을 선택한다.
- 선택된 영상에 오른쪽 마우스를 눌러 아래 그림과 같은 소스 코드 복사 선택
(예시) <iframe width="879" height="494" src="https://www.youtube.com/embed/Pk0tYY_qCYY" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> - 복사된 소스 코드를 코드 에디터(Editor)에 붙여넣기.
감사합니다.
잘못된 정보나 오타 및 수정사항이 있을 경우 댓글로 달아주시면 감사하겠습니다.
반응형
'GUI > HTML & CSS' 카테고리의 다른 글
| [HTML] 웹페이지 방문자 분석 기능 추가하기 (10step) (0) | 2022.05.29 |
|---|---|
| [HTML] 채팅 기능 추가하기 (10step) (0) | 2022.05.29 |
| [HTML] 댓글 기능 추가하기 (11step) (0) | 2022.05.29 |
| [Atom] Atom Editor 사용방법 및 조작키 (updating) (0) | 2022.05.27 |
| [HTML] 태그 모음 (0) | 2022.05.19 |