본문 바로가기

HTML/HTML 기본문법77

HTML 비디오(HTML Video) HTML 요소는 웹 페이지에 비디오를 표시하는 데 사용됩니다. HTML 요소 HTML로 비디오를 표시하려면 요소를 사용한다: 브라우저가 비디오 태그를 지원하지 않습니다. 위의 코드를 실행한 결과물이 아래 그림이다. HTML 비디오 동작 방식 control 속성은 재생, 일시 중지 및 볼륨과 같은 비디오 컨트롤을 추가한다. 항상 width 및 height 속성을 포함하는 것이 좋다. 높이와 너비를 설정하지 않으면 비디오를 로드하는 동안 페이지가 깜박일 수 있다. 요소를 사용하면 브라우저가 선택할 수 있는 대체 비디오 파일을 지정할 수 있다. 브라우저는 인식된 첫 번째 형식을 사용한다. 태그와 태그 사이의 텍스트는 요소를 지원하지 않는 브라우저에서만 표시된다. HTML 자동재행(autoplay) 비디오를 자.. 2023. 6. 19.
HTML 멀티미디어(HTML Multimedia) 웹상의 멀티미디어는 소리, 음악, 비디오, 영화, 애니메이션이다. 멀티미디어란? 멀티미디어는 다양한 형식으로 제공된다. 이미지, 음악, 사운드, 비디오, 레코드, 영화, 애니메이션 등 들을 수 있거나 볼 수 있는 거의 모든 것일 수 있다. 웹 페이지에는 종종 다양한 유형과 형식의 멀티미디어 요소가 포함된다. 멀티미디어 포맷 멀티미디어 요소(예: 오디오 또는 비디오)는 미디어 파일에 저장된다. 파일 형식을 검색하는 가장 일반적인 방법은 파일 확장자를 확인하는 것이다. 멀티미디어 파일에는 .wav, .mp3, .mp4, .mpg, .wmv 및 .avi와 같은 형식과 다양한 확장자가 있다. 일반 비디오 포맷 세상에는 많은 비디오 형식이 있다. MP4, WebM 및 Ogg 형식은 HTML에서 지원된다. MP4 .. 2023. 6. 18.
HTML SVG 그래픽스 SVG는 벡터 기반 그래픽을 XML 형식으로 정의한다. SVG란? SVG는 Scalable Vector Graphics의 약자이다 SVG는 웹의 그래픽을 정의하는 데 사용된다 SVG는 W3C 권장 사항이다 HTML 태그 HTML 요소는 SVG 그래픽을 위한 컨테이너이다. SVG에는 경로, 상자, 원, 텍스트 및 그래픽 이미지를 그리는 여러 가지 방법이 있다. SVG 원(SVG Circle) 죄송합니다. 브라우저는 인라인 SVG를 지원하지 않습니다. 상기의 예제를 실행한 결과 그림은 아래와 같다. SVG 사각형 죄송합니다. 브라우저는 인라인 SVG를 지원하지 않습니다.. 상기의 예제를 실행한 결과 그림은 아래와 같다. SVG 둥근 사각형(SVG rounded rectangle) 죄송합니다. 브라우저는 인라.. 2023. 6. 17.
HTML 캔버스 그래픽스(Canvas Graphics) HTML 요소는 웹 페이지에 그래픽을 그리는 데 사용된다. 아래 그림은 그래픽은 로 작성되었습니다. 빨간색 사각형, 그라데이션 사각형, 다색 사각형 및 다색 텍스트의 4가지 요소를 보여준다. HTML 캔버스란 무엇인가? HTML 요소는 JavaScript를 통해 그래픽을 즉시 그리는 데 사용된다. 요소는 그래픽을 위한 컨테이너일 뿐이다. 실제로 그래픽을 그리려면 JavaScript를 사용해야 한다. 캔버스에는 경로, 상자, 원, 텍스트를 그리고 이미지를 추가하는 여러 가지 방법이 있다. HTML 캔버스 예제 캔버스는 HTML 페이지의 직사각형 영역이다. 기본적으로 캔버스에는 테두리와 내용이 없다. 마크업은 다음과 같습니다: 참고: 항상 id 특성(스크립트에서 참조)과 너비 및 높이 특성을 지정하여 캔버스.. 2023. 6. 16.