1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h3>비디오 플레이</h3>
    <!-- 
        controls - 재생버튼, 일시정지버튼, 음량조절 등의 기능 추가
        (controls가 없을 때에는 미디어에 마우스 오른쪽을 클릭하여 컨트롤)
        
        autoplay - 자동재생 
        (크롬브라우저는 자동재생이 안되는 듯, 엣지 등 기타 브라우저로 테스트)
 
    -->
    <video src="media/bear.mp4" width="320" height="240" controls autoplay>
        브라우저가 video 태그를 지원하지 않습니다.</video>
</body><hr>
    <h3>오디오 플레이</h3>
    <!-- loop - 반복재생 -->
    <audio src="media/EmbraceableYou.mp3" controls autoplay loop>
        브라우저가 audio 태그를 지원하지 않습니다.
    </audio>
</html>
cs

위 코드를 적용하면 아래와 같이 나옵니다.

 

 

--

크롬 자동재생 관련 링크
https://blog.edit.kr/entry/video-%ED%83%9C%EA%B7%B8-autoplay-%EC%9E%AC%EC%83%9D%EC%9D%B4-%EC%95%88%EB%90%A0%EB%95%8C-Chrome-Safari

'Web > Html_Css' 카테고리의 다른 글

검색 페이지 만들기  (0) 2020.03.04
form 폼 태그  (0) 2020.03.04
페이지 내의 프레임에 사이트 띄우기  (0) 2020.03.04
iframe 사용 예제1  (0) 2020.03.03
a 태그에 다운로드 속성(html5 지원)  (0) 2020.03.03

+ Recent posts