HTML基础插入视频等标签的使用_html怎么使用视频标签-优快云博客

本文链接：https://blog.youkuaiyun.com/opo77_/article/details/105772607

一只名叫Turisa的小狗从狗狗星球出发，邀请你参观它的太空空间站。这里不仅有友好的问候，还有天气报告和心情分享。独特的诗歌、图片展示，以及与小狗玩耍的指南，让你感受不一样的星际体验。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

HTML1

<body>
<!-- 主体 -->
<h1>小狗Turisa的太空空间站</h1>
<!-- 标题 -->
<hr/>
<!-- 水平线horizontal -->
<p>你好，我是一只名叫<i>Turisa</i>的小狗，我来自<i>狗狗星球</i>。欢迎来到我的<b>太空空间站</b>。</p>
<!-- 段落 -->
<p>这是我使用了一个换行符<br/>的文字</p>
<!-- 换行符break -->
<i>今天天气很好</i>
<!-- 斜体字italic -->
<b>我今天心情很好</b>
<!-- 加粗bord -->
<pre>
 Black and white
 Thick and furry
 Fast as the wind
 Always ina hurry
</pre>
<!-- preformatted预先定好格式 -->
<img src="https://i-blog.csdnimg.cn/blog_migrate/11ba433eb32d2c9f6714f1d6f0775c98.jpeg" />

</body>

效果：

小狗Turisa的太空空间站

你好，我是一只名叫Turisa的小狗，我来自狗狗星球。欢迎来到我的太空空间站。

这是我使用了一个换行符
的文字

今天天气很好 我今天心情很好

 Black and white
 Thick and furry
 Fast as the wind
 Always ina hurry

HTML2


<ol>
    <li>糯米洗净泡好之后放入电饭锅中，加入糖，眼，倒入椰浆，再加适量水，开始煮饭功能</li>
    <li>芒果去皮去核切两大片</li>
    <li>把煮好的糯米饭以及芒果放在盘子里</li>
    <li>在盘子里倒入一些椰浆</li>
</ol>
 <!-- ordered list 有序列表 -->

<p>芝士蛋糕配方</p>
<ul>
    <li>奶油奶酪</li>
    <li>鸡蛋</li>
    <li>黄油</li>
    <li>牛奶</li>
    <li>低筋面粉</li>
    <li>细砂糖</li>
</ul>
<!-- unordered list无序列表 -->
 
<dl>
    <dt>Ponny</dt>
        <dd>
            据最新的吉尼斯世界纪录统计，现在世界上最长寿的猫是一只叫做Poppy的猫，它已有24岁,相当于人类的114岁左右了。Poppy在它24岁时成为了世界上最古老的猫冠。Poppy出生于1990年2月。现在它已十分的老了
        </dd>
    <dt>Boo Boo</dt>
        <dd>世界上最小的狗 现今世界上最小的狗是一只名叫Boo Boo的小狗，它是一只吉娃娃，这只来自美国肯塔基的小狗，身在2007年12月测得的身长只有10.16厘米（4英寸）。</dd>
       
    
    <dt>Chilli</dt>
        <dd>世界上最大的奶牛英国这头名叫Chilli的奶牛是世界上最大的奶牛。奶牛高6英尺重一吨多，这还不是他的最终体重，“红辣椒”还在成长中</dd>   
</dl>
<!-- definition list 定义列表<dt>代表被定义的词</dt><dd>代表词的意义</dd> -->

<a href="https://www.cxy61.com/index-image/index.html">橙旭园 儿童编程</a>

<p>电影评论：</p>
    <ul>
        <li><a href="https://movie.douban.com/subject/1291546/">霸王别姬</a></li>
        <li><a href="https://movie.douban.com/subject/1291875/">阳光灿烂的日子</a></li>
        <li><a href="https://movie.douban.com/subject/1291561/">千与千寻</a></li>
        <li><a href="https://movie.douban.com/subject/3541415/">盗梦空间</a></li>
	</ul>

<!-- 小狗网站 -->
<body>
    <!-- 主体 -->
    <h1>小狗Turisa的太空空间站</h1>
    <!-- 标题 -->
    <hr/>
    <!-- 水平线horizontal -->
    <p>你好，我是一只名叫<i>Turisa</i>的小狗，我来自<i>狗狗星球</i>。欢迎来到我的<b>太空空间站</b>。</p>
    <!-- 段落 -->
    <p>这是我使用了一个换行符<br/>的文字</p>
    <!-- 换行符break -->
    <i>今天天气很好</i>
    <!-- 斜体字italic -->
    <b>我今天心情很好</b>
    <!-- 加粗bord -->
    <pre>
     Black and white
     Thick and furry
     Fast as the wind
     Always ina hurry
    </pre>
    <!-- preformatted预先定好格式 -->
    <img src="https://i-blog.csdnimg.cn/blog_migrate/11ba433eb32d2c9f6714f1d6f0775c98.jpeg" />
    <img src="https://i-blog.csdnimg.cn/blog_migrate/3658eddfffa43e120167741f1576673e.jpeg"/>
    <p>如何开始与一只小狗玩耍</p>
    <ol>
        <li>得到小狗主人同意，确定小狗打过疫苗</li>
        <li>深情望着小狗双眼并且微笑</li>
        <li>看到小狗尾巴在摇摆</li>
        <li>缓缓的伸出手，摸摸小狗脑袋</li>
        <li>根据小狗反应，决定下一步动作</li>
    </ol>
    <p>狗狗的品种</p>
    <ul>
        <li>哈士奇</li>
        <li>吉娃娃</li>
        <li>柴犬</li>
        <li>金毛</li>
        <li>斗牛犬</li>
        <li>中华田园犬</li>
    </ul>
    <a href="https://www.worldanimalprotection.org.cn/">推进世界动物保护</a>
    <p>动物保护：</p>
    <ul>
    <li><a href="http://www.china.com.cn/aboutchina/zhuanti/ysdw/2008-12/08/content_16915955.htm" target="_blank">中国野生动物保护协会</a></li>
    <li><a href="https://capn-online.info/" target="_blank">中国动物保护网</a></li>
    <li><a href="https://www.worldanimalprotection.org.cn/" target="_blank">世界动物保护协会</a></li>
    </ul>
    <!-- target="_blank"使网站在新窗口打开 -->
</body>

效果：

糯米洗净泡好之后放入电饭锅中，加入糖，眼，倒入椰浆，再加适量水，开始煮饭功能
芒果去皮去核切两大片
把煮好的糯米饭以及芒果放在盘子里
在盘子里倒入一些椰浆

芝士蛋糕配方

奶油奶酪
鸡蛋
黄油
牛奶
低筋面粉
细砂糖

Ponny

据最新的吉尼斯世界纪录统计，现在世界上最长寿的猫是一只叫做Poppy的猫，它已有24岁,相当于人类的114岁左右了。Poppy在它24岁时成为了世界上最古老的猫冠。Poppy出生于1990年2月。现在它已十分的老了

Boo Boo

世界上最小的狗现今世界上最小的狗是一只名叫Boo Boo的小狗，它是一只吉娃娃，这只来自美国肯塔基的小狗，身在2007年12月测得的身长只有10.16厘米（4英寸）。

<dt>Chilli</dt>
    <dd>世界上最大的奶牛英国这头名叫Chilli的奶牛是世界上最大的奶牛。奶牛高6英尺重一吨多，这还不是他的最终体重，“红辣椒”还在成长中</dd>

橙旭园儿童编程

电影评论：

小狗Turisa的太空空间站

你好，我是一只名叫Turisa的小狗，我来自狗狗星球。欢迎来到我的太空空间站。

这是我使用了一个换行符
的文字

今天天气很好 我今天心情很好

     Black and white
     Thick and furry
     Fast as the wind
     Always ina hurry

如何开始与一只小狗玩耍

得到小狗主人同意，确定小狗打过疫苗
深情望着小狗双眼并且微笑
看到小狗尾巴在摇摆
缓缓的伸出手，摸摸小狗脑袋
根据小狗反应，决定下一步动作

狗狗的品种

哈士奇
吉娃娃
柴犬
金毛
斗牛犬
中华田园犬

推进世界动物保护

动物保护：

HTML3


<video src="https://static1.bcjiaoyu.com/%E4%B8%AD%E5%8D%8E%E9%A3%8E%E5%85%89.mp4" preload="none" controls loop></video>
<!-- 插入视频 -->
<dl>
    <dt>preload="..."</dt>
    <dd>后面可以跟三种内容</dd>
<ul>
    <dt>none</dt>
    <dd> 表示在用户按下播放按钮之前，浏览器不会加载视频</dd>

    <dt>auto</dt>
    <dd>表示浏览器应该在页面加载时载入视频</dd>

    <dt>metadata</dt>
    <dd>表示当页面加载后仅加载音频/视频的元数据</dd>
</ul>
    <dt>controls</dt>
    <dd>使浏览器提供默认播放控件</dd>
    <dt>loop</dt>
    <dd>表示在视频结束之后重新反复播放</dd>
    <dt>autoplay</dt>
    <dd>视频文件自动播放</dd>
</dl>
<audio src="https://static1.bcjiaoyu.com/SolarRollerCoaster%205.8.15.MP3" controls loop></audio>
<!-- 插入音频 -->
<!-- div将一组元素变成块级元素 -->