Question

任何具有html css专业知识的人都会帮助我解决这个我无法解决的简单问题。

基本上，我的html页面有一个视频元素，它附加了一个src属性。

现在，我想要做的是，从视频元素中删除此src属性，并将此源放在该视频元素的css类中。

那么，如何从css中设置视频元素的src？

我尝试过使用网址，内容属性，但似乎不起作用或许我做错了。我将非常感谢能为此提供任何输入或共享一个小代码的人，这些代码将使用css来设置html5视频元素的来源。请帮我。谢谢。

Answer 1

您无法通过CSS设置视频源。因为您在下面看到了视频的基本结构：

<video>
  <source src="sample.mp4" type="video/mp4">
  <source src="sample.ogg" type="video/ogg">
  Your browser does not support HTML5 video.
</video>

您可以设置其他属性，如背景图像，颜色等。但是，您无法通过css设置源，css用于设计播放按钮＆amp;任何其他按钮功能。如果您确实需要在不使用<source src="sample.mp4" type="video/mp4"></source>的情况下执行此操作，则必须使用JavaScript。

Answer 2

我使用显示设置为无或阻止的CSS进行了此操作，因此根据用户是在笔记本电脑上还是在手机上播放视频（“ sample.mp4”或“ sample2.mp3”。< / p>

HTML：

<video id='video'>
    <source src="sample.mp4" type="video/mp4">
    Your browser does not support HTML5 video.
</video>
<video id='video2'>
    <source src="sample2.mp4" type="video/mp4">
    Your browser does not support HTML5 video.
</video>

CSS：

#video2 {display:none;}

@media only screen and (max-width: 500px) {
    #video2 {display:block;}
    #video {display:none;}
}

如何从css

2 个答案: