HTML5 및 CSS3 기반 웹 페이지에 오디오를 추가하는 방법 - 인형

HTML은 오랫동안 이미지를 지원했지만 이제는 오디오 파일과도 잘 작동합니다. 이전에는 오디오와 같은 외부 프로그램이 필요했습니다.

새로운 태그로 HTML5의 웹 페이지에 오디오를 추가하는 것은 매우 쉽습니다. 이 페이지를 생성하는 코드는

오디오입니다. html

오디오 데모






 브라우저가 HTML5 오디오를 지원하지 않습니다.이 링크를 대신 사용하십시오: Allemande. mp3
음악: J. S. Bach "Allemande"Partita for Violin # 2

현재의 거의 모든 브라우저가 태그를 지원하지만 여전히 지원할 형식에 동의 할 수는 없습니다. 일부 브라우저는 MP3 파일을 지원하고, 일부는 Ogg라고하는 새로운 표준을 지원하고, 일부는 WAV를 지원합니다.

사운드가 재생되는지 확인하는 가장 좋은 방법은 두 가지 형식을 제공하는 것입니다. 종종 Ogg와 MP3 포맷을 포함하여 모든 주요 브라우저에서 오디오가 재생되도록합니다.

페이지에 오디오 파일을 추가하려면 다음 단계를 따르십시오.

1. 페이지에 오디오 태그를 추가하십시오.

   태그는 오디오 파일이 배치 될 위치를 나타냅니다. 코드에서 태그를 배치하는 위치는 컨트롤이 나타나는 위치와 일치합니다.

2. 컨트롤을 켭니다.

   속성이있는 제어판을 지정할 수 있습니다. 이로 인해 작은 컨트롤이 나타납니다. 이 지시문을 그대로두면 제어판이 없어 지므로 사용자가 클립을 재생할 수 없습니다.

3. 요소 하나 또는 두 개를 만듭니다.

   쌍 안에 하나 이상의 요소를 추가합니다. 각 소스 요소는 링크 할 파일을 나타냅니다.

4. 파일을 나타 내기 위해 속성을 설정하십시오.

   태그의 속성은 재생할 오디오 파일의 파일 이름을 나타내는 데 사용됩니다.

5. 구식 브라우저 용 대체 코드를 추가하십시오.

   와 태그 사이의 추가 HTML 코드는 사운드 태그를 이해하지 못하는 브라우저에서만 해석됩니다. 원하는 경우 일반 앵커를 추가하여 사운드 효과를 다운로드 할 수 있습니다. 이렇게하면 오래된 브라우저를 사용하는 사람들도 누락 된 내용을들을 수 있습니다.