HTML에 비디오를 포함시키는 방법<비디오>

1719 단어 HTMLvideoiframetech
HTML에 비디오를 포함시키는 방법
· iframe 태그 사용 (유튜브 등 동영상 사이트에서 읽기)
· 비디오 태그 사용(비디오 파일 업로드 및 읽기)
videoタグの使用方法
・mp4, webmなどの動画ファイルの読み込みで動画を表示
<video src="~~"></video>
  属性一覧
    ・controls コントロールパネルを表示する 再生ボタン 再生 ボリューム
    ・auto 自動再生
    ・loop 繰り返し再生
    ・poster 開始画面の画像を設定
    ・playsinline インライン再生を可能にする
      スマホのsafariでwebサイトの動画の埋め込まれている動画を再生しようとすると強制的に全画面表示になってしまうことがある。
      全画面表示をせずにその場で再生させることができるのがインライン再生
      ・インライン再生を可能にするには、autoplay, muted, playsinline 三つの属性が必要になる。
      どれか一つでもかけているとうまくインライン再生されないので注意する。
    ・width/height 横幅と高さを指定する
    ・preload 動画の読み込み設定
      webサイトを読み込む時に、事前に動画ファイルをDLするかを指定する。
      none: 事前のファイル読み込みを禁止
      metadata: 長さやファイルサイズなどのメタ情報（動画の情報）だけを読み込む
      auto: 初期値：動画ファイルを事前にダウンロードする
    ・複数の形式の動画を読み込む
      mp4で動画が再生されない時のことを考えて複数形式の動画をあらかじめ用意しておく。（セーフティネット）
      １「mp4」を読み込む
      ２ だめなら「webm」を読み込む
      ３それでもダメなら「ogg」
      ４それでもダメなら「エラーメッセージ」を表示する
youtubeなどの動画サービスを埋め込む
  ・iframeタグを使用する。
  １youtubeの動画の「共有」から「埋め込む」を選択
  ２埋め込むためのコードが表示されるのでコピーしてhtmlに貼り付けるだけでOK

・Videoタグで動画が再生されない３つの、ケースと解決策
  ・androidで動画が再生できない
    「Basic認証」でwebページにアクセスできる人を「ユーザーパスワード」を用いて制限するという機能がある。
    そのBasic認証がかかったページをandroidで閲覧すると動画を見ることができない。
  ・mp4なのに再生できない
    mp4でも「コーデック」といい、圧縮のデータ方式が異なるので
    コーデックを確認して「AVC形式」「H.265形式」でmp4を経て書き出す
  ・IEでvideoタグが使えない場合
    IZE8以前では「videoタグ」が使用できないので「html5media.js」を使用する
    <head>タグの中にする文言が、ある

背景に動画を表示する方法
  ・要素いっぱいに動画のサイズを広げて、文字の入ったdiv要素をabsoluteで、浮かせて動画の上に載せるイメージ
iframe
・ 웹 사이트에 다른 웹 사이트를 삽입할 수 있음(other youtube and Google maps)
• iframe의 장식은 테두리 디자인만 가능합니다. 읽는 페이지 디자인을 바꾸기 위해 JS를 사용합니다
・ iframe를 사용하면 비교적 적은 공간에서 많은 정보를 굴려서 읽을 수 있다.
다만 이것은 목적 정보를 찾기가 매우 어렵다.
・ CSS의 오버플로우 속성에서 프레임을 시뮬레이션할 수 있다
Fashion MNIST Dataset 소개
Apache2에서 CGI 활성화

좋은 웹페이지 즐겨찾기

개발자 우수 사이트 수집

개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
best100-homepage