Heim  >  Artikel  >  Web-Frontend  >  Tages-TML

Tages-TML

PHPz
PHPzOriginal
2024-08-06 10:45:001132Durchsuche

Day TML

Langsamer Tag im Vergleich zu gestern.
Begann mit einer Auffrischung des gestrigen Themas und ging dann zum heutigen Thema über
Studierte HTML-Medien
Bilder, Audio, Videos...
(WERDE DAS PROJEKT SPÄTER ANHÄNGEN, DA ICH GITHUB-PROBLEME HABE)

*Meine Notizen: *

Bilder einbetten

Um ein Bild in HTML einzubetten, verwenden Sie die Funktion Etikett. Dieses Tag ist selbstschließend und erfordert das src-Attribut, um den Pfad des Bildes anzugeben, und das alt-Attribut, um alternativen Text für die Barrierefreiheit bereitzustellen.

Beispiel:

 <img src="path/to/image.jpg" alt="Description of image" width="600" height="400"> 

  • src: Pfad zur Bilddatei (relative oder absolute URL).
  • alt: Textbeschreibung des Bildes (wichtig für Barrierefreiheit und SEO).
  • Breite und Höhe: Optionale Attribute zur Angabe von Abmessungen.

Audio einbetten

Um Audio einzubetten, verwenden Sie die Schaltfläche

Beispiel:

<audio controls>
  <source src="path/to/audio.mp3" type="audio/mpeg">
  <source src="path/to/audio.ogg" type="audio/ogg">
  Your browser does not support the audio element.
</audio>
  • Steuerelemente: Zeigt die Wiedergabesteuerelemente an.
  • : Gibt die Audiodatei und ihren MIME-Typ an.

Video einbetten

Um Videos einzubetten, verwenden Sie die Schaltfläche

<video width="600" height="400" controls>
  <source src="path/to/video.mp4" type="video/mp4">
  <source src="path/to/video.ogg" type="video/ogg">
  Your browser does not support the video tag.
</video>
  • Breite und Höhe: Gibt die Abmessungen des Videoplayers an.
  • Steuerelemente: Zeigt die Wiedergabesteuerelemente an.
  • : Gibt die Videodatei und ihren MIME-Typ an.

Alle zusammen

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Media Embedding Example</title>
</head>
<body>

  <h1>Embedding Images, Audio, and Video in HTML</h1>

  <h2>Image Example</h2>
  <img src="path/to/image.jpg" alt="Beautiful Landscape" width="600" height="400">

  <h2>Audio Example</h2>
  <audio controls>
    <source src="path/to/audio.mp3" type="audio/mpeg">
    <source src="path/to/audio.ogg" type="audio/ogg">
    Your browser does not support the audio element.
  </audio>

  <h2>Video Example</h2>
  <video width="600" height="400" controls>
    <source src="path/to/video.mp4" type="video/mp4">
    <source src="path/to/video.ogg" type="video/ogg">
    Your browser does not support the video tag.
  </video>

</body>
</html>

Fertig

Das obige ist der detaillierte Inhalt vonTages-TML. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn