HTML에 동영상을 삽입하고 모든 브라우저와 호환되는 방법_HTML/Xhtml_웹페이지 제작

HTML에 비디오를 삽입하는 데 가장 일반적으로 사용되는 두 가지 방법이 있습니다. 하나는 고대의 태그이고, 다른 하나는 HTML5의

전자는 호환성은 있지만 사용하기에는 그다지 편리하지 않습니다. 후자는 사용하기에는 매우 편리하지만 호환성이 골치아픈 편입니다.

후자의 호환성에는 문제가 많지만, 사용하기 매우 편리하고 향후 웹 디자인의 발전 추세에 부합하기 때문에 영상 삽입 시 후자를 주요 방식으로 사용하고 있기 때문입니다. 호환성 문제가 있는 경우 전자가 보조 장치로 사용됩니다.

예제는 다음과 같습니다.

코드를 복사하세요

코드는 다음과 같습니다.

현재 비디오 요소는 세 가지 비디오 형식을 지원합니다.
형식 IE Firefox Opera Chrome Safari
Ogg 아니요 3.5 10.5 5.0 아니요
MPEG 4 9.0 아니요 아니요 5.0 3.0
WebM 아니요 4.0 10.6 6.0 아니요

Ogg = Theora 비디오 인코딩 및 Vorbis 오디오 인코딩이 포함된 Ogg 파일

MPEG4 = H.264 비디오 인코딩 및 Vorbis 오디오 인코딩이 포함된 MPEG 4 파일 AAC 오디오 인코딩

WebM = VP8 비디오 인코딩 및 Vorbis 오디오 인코딩이 포함된 WebM 파일

참고: 형식은 위의 세 가지 세부 요구 사항을 준수해야 합니다. 예를 들어 MPEG 4는 H여야 합니다. 264 비디오 및 AAC 오디오.

이 경우 비디오 형식이 맞다면 대부분의 브라우저의 호환성 결과에 상당히 만족하지만 IE678은 이를 지원하지 않으며 해당 사용자는 여전히 중국에서 매우 큰 그룹입니다. 이를 지원하는 다른 솔루션을 생각해야 합니다.

코드 복사

코드는 다음과 같습니다.

여기에는 동영상을 제외한 일부 파일이 소개되어 있습니다. flv 형식과 여러 swf 또는 js 파일은 모두 DW 소프트웨어로 생성됩니다. 태그를 연구하고 싶지 않은 친구는 DW 소프트웨어로 이동하여 생성할 수 있습니다. 교묘하게 결합할 수 있습니다

이 두 가지 코드를 사용하면 모든 주요 브라우저와 호환되는 최종 코드를 얻을 수 있습니다.

다음과 같이 할 수 있습니다.

jquery를 사용하여 브라우저가 IE인지 확인합니다(IE는 서버 문제로 인해 상위 버전을 통과하지 못할 수 있으므로 특정 IE 버전을 확인할 필요는 없습니다). 이유는 당분간 < for all IE ;object> 태그를 사용하고 버전에 따라 다른 태그를 로드하는 것입니다. 코드는 다음과 같습니다.

코드 복사 코드는 다음과 같습니다.