Question

我正在尝试调整网页模板以满足我的需求。该网站看起来像这样：http://tomcreus.com 在左下角有三个按钮（1,2,3），可以更改背景图片。我想用嵌入式视频替换照片。这可能吗？这有多难？我需要发布哪些代码才能提供帮助？

编辑：

<ul class="pagination">
    <li class="current"><a href="images/bg_img1.jpg">1</a></li>
    <li><a href="images/bg_img1.jpg">2</a></li>
    <li><a href="images/bg_img3.jpg">3</a></li>
</ul>

提前谢谢！

Answer 1

您可以将video放在anchor标签旁边。

<ul class="pagination">
    <li class="current">
        <a href="https://www.google.com/">
            <video width="320" height="270" controls>
                <source src="steve_powell_320_hard.mp4"  type="video/mp4; codecs=avc1.42E01E, mp4a.40.2">
                <source src="steve_powell_320_hard.webm" type="video/webm; codecs=vp8, vorbis">
                <source src="steve_powell_320_hard.ogv"  type="video/ogg; codecs=theora, vorbis">
            </video>
        </a>
    </li>
    <li><a href="images/bg_img1.jpg">2</a></li>
    <li><a href="images/bg_img3.jpg">3</a></li>
</ul>

只需将src元素的source更改为系统/服务器上的物理视频文件，或者从网站上提供视频的网址。

编辑：

此w3schools链接有助于嵌入youtube视频。 this链接用于在html中嵌入物理视频文件。

编辑：

检查以下两个问题。你可能会从那里得到一些方向。这是HTML5

如何用嵌入的视频替换菜单按钮调用的图像

1 个答案: