首页  >  文章  >  web前端  >  日间TML

日间TML

PHPz
PHPz原创
2024-08-06 10:45:001126浏览

Day TML

与昨天相比缓慢的一天。
首先回顾一下昨天的主题,然后转到今天的主题
研究 HTML 媒体
图片、音频、视频...
(稍后会附加项目,因为我有 GITHUB 问题)

*我的笔记:*

嵌入图像

要在 HTML 中嵌入图像,请使用 日间TML;标签。该标签是自动关闭的,需要 src 属性来指定图像的路径,并需要 alt 属性来提供替代文本以供可访问性。

示例:

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

  • src:图像文件的路径(相对或绝对 URL)。
  • alt:图像的文本描述(对于可访问性和 SEO 很重要)。
  • widthheight:指定尺寸的可选属性。

嵌入音频

要嵌入音频,请使用

示例:

<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>
  • 控件:显示播放控件。
  • :指定音频文件及其 MIME 类型。

嵌入视频

要嵌入视频,请使用

<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>
  • 宽度高度:指定视频播放器的尺寸。
  • 控件:显示播放控件。
  • :指定视频文件及其 MIME 类型。

大家一起

<!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>

完成

以上是日间TML的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn