html基本标签

html 复制代码
<h1></h1>
<p></p>

h是标签从h1~h6,没用h7,h8

p是段落

html 复制代码
<a href="https://www.educoder.net">Educoder平台</a>

href可以指定链接进行跳转

html 复制代码
<img src="https://www.educoder.net/attachments/download/207801" alt="小狗走路"/>

src是指图片地址,alt是未加载出来的时候显示的文字

html 复制代码
<div align="center">
        <img src="./iTunesArtwork@2x.png"  align="bottom" width="50" height="50" alt="50*50 应用图标">
        <img src="./iTunesArtwork@2x.png" width="100" height="100" alt="100*100 应用图标">
        <img src="./iTunesArtwork@2x.png" width="200" height="200" alt="200*200 应用图标"></div>

div中可以指定align信息,img也可以

提供一段代码

html 复制代码
<!DOCTYPE html>

<head>
    <meta charset="UTF-8" />
    <title>HTML - 音频</title>
</head>

<body>
    <h1 align="center">青石巷</h1>
    <br>
    <div align="center">
    <audio controls="controls" autoplay="autoplay" loop="loop" height="100" width="100">
        <source src="https://www.educoder.net/api/attachments/171686" type="audio/wav"/>
        <source src="https://www.educoder.net/api/attachments/171685" type="audio/ogg"/>
        <source src="https://data.educoder.net/api/attachments/171679" type="audio/mp3"/>
        <embed width="100" height="100">
        你的浏览器不支持该音频格式。 Your browser does not support this audio format.
    </audio>
    </div>
    <br>
    <p align="center" style="color:grey;">HTML5 audio 播放示例</p>
    <p align="center" style="color:grey;"><small>注意:音频控件显示效果在不同浏览器中有些许差别。</small></p>
</body>

其中autoplay是页面加载出来就播放,loop是指播放完了重新播放

wav,ogg,mp3是音频的三种方式可以进行尝试播放如果不能成功就会尝试<embed>

接下来给出播放视频的代码

html 复制代码
<!DOCTYPE html>

<head>
    <meta charset="UTF-8" />
    <title>HTML - 视频</title>
</head>

<body>    
    <h1 align="center">扬帆起航</h1>
    <video width="550" control="control" autoplay loop>
        <source src="./video/Sail-Away.mp4" type="video/mp4" />
        <source src="./video/Sail-Away.ogv" type="video/ogv" />
        <source src="./video/Sail-Away.webm" type="video/webm"/>
        <object data="./video/Sail-Away.mp4" width="320" height="240">
        <embed src="./video/Sail-Away.swf" width="320" height="240" />
            你的浏览器不支持该视频格式。Your browser does not support this video format.
        </object>
    </video>
    <br>
    <p align="center" style="color:grey;">HTML5 video 播放示例</p>
    <p align="center" style="color:grey;"><small>注意:视频控件显示效果在不同浏览器中有些许差别。</small></p>
</div>
</body>
相关推荐
Code blocks5 分钟前
GB28181视频服务wvp部署(一)
java·spring boot·后端
我命由我1234511 分钟前
Spring Boot - Spring Boot 静态资源延迟响应(使用拦截器、使用过滤器、使用 ResourceResolver)
java·spring boot·后端·spring·java-ee·intellij-idea·intellij idea
Xzh042317 分钟前
前后端学习的交界
java·ajax·maven·axios·测试
aichitang202422 分钟前
欧拉拓扑学公式:几何与拓扑的交汇
html·拓扑学
peachSoda736 分钟前
封装一个不同跳转方式的通用方法(跳转外部链接,跳转其他小程序,跳转半屏小程序)
前端·javascript·微信小程序·小程序
豆沙沙包?41 分钟前
2025年--Lc201- 378. 有序矩阵中第 K 小的元素(排序)--Java版
java·线性代数·矩阵
华仔啊43 分钟前
3 分钟让你彻底搞懂 Spring 观察者和发布者模式的本质区别
java·后端
没有bug.的程序员44 分钟前
服务治理与 API 网关:微服务流量管理的艺术
java·分布式·微服务·架构·wpf
宠友信息1 小时前
java微服务驱动的社区平台:友猫社区的功能模块与实现逻辑
java·开发语言·微服务
@PHARAOH1 小时前
HOW - 浏览器兼容(含 Safari)
前端·safari