Video tag in HTML | Spiegato

Video tag in HTML | Spiegato
L'aggiunta di video sui siti Web può essere un modo coinvolgente per esprimere i tuoi pensieri e quindi i video possono attirare più spettatori. Usando i video si possono fornire alcuni concetti complicati in modo molto semplice ed efficace. Quindi, HTML fornisce un tag per incorporare un video sui siti Web, un tag può avere più attributi per controllare il comportamento di qualsiasi video.

Questo articolo presenterà una comprensione dettagliata dei seguenti concetti:

  • Sintassi di tag
  • Attributi di tag
  • Supporto e formati video del browser
  • Come usare il tag in HTML

Sintassi

Lo snippet di seguito mostra la sintassi di base del tag.

Attributi

  • Controlli: utilizzato per visualizzare le opzioni di controllo all'utente E.G. Gioca, pausa, muto, ecc.
  • src: determina l'URL
  • ciclo continuo: Il video verrà riprodotto in un ciclo I.e. ancora e ancora.
  • tenuto: Inizialmente, il video verrà disattivato
  • Preload: Specificare la vista dell'autore su come verrà caricato il video quando la pagina web si carica
  • riproduzione automatica: Il video verrà riprodotto automaticamente
  • altezza: Utilizzato per specificare l'altezza del video
  • larghezza: utilizzato per specificare la larghezza del video
  • manifesto: Utilizzato per mostrare un'immagine durante il download di video.

Supporto e formati video del browser

Tag ha tre formati i.e. MP4, WebM, OGG e questi formati saranno specificati all'interno dell'elemento sorgente dell'attributo "Tipo". Chrome, Microsoft Edge, Opera e Mozilla Firefox supportano tutti e tre i formati video mentre Safari e Internet Explorer supportano solo il formato MP4.

Più formati possono essere utilizzati nel tag, quindi è una buona pratica specificare due formati (OGG e MP4) nel video tag in modo che il video venga riprodotto sulla maggior parte dei browser. Il browser utilizzerà il primo formato video riconosciuto. Se il browser non riconosce nessuno dei formati di file specificati, verrà visualizzato il testo scritto all'interno del tag iniziale e finale.

Come usare il tag in HTML

Nel tag HTML, possono essere utilizzati più attributi per controllare il comportamento dei tag come "Controlli" Abilita la visibilità dei controlli i.e. Gioca, pausa, ecc. Il seguente pezzo di codice elabora come utilizzare il tag in HTML:





Lo snippet di cui sopra visualizza la seguente uscita:

I controlli sono visibili, il video è disattivato, verifica che tutti gli attributi funzionano perfettamente.

Esempio

Ora modificheremo il codice sopra per testare il funzionamento dell'attributo poster:



Ora un'immagine verrà visualizzata sul video fino a quando non abbiamo fatto clic sul pulsante di riproduzione:

Allo stesso modo, puoi testare il funzionamento degli attributi rimanenti.

Conclusione

Il tag può essere utilizzato per aggiungere un video su un sito Web, è possibile utilizzare diversi attributi all'interno del video tag per eseguire funzionalità diverse e.G. Il poster mostra un'immagine fino a quando qualcuno non fa clic sul video, Autoplay consente a un video di riprodurre automaticamente e così via. Questo articolo dimostra ciò che è il tag HTML e come utilizzare il tag. Inoltre, fornisce una spiegazione dettagliata dei formati video e dei browser disponibili.