当我为视频元素指定css类名时，为什么我的html被覆盖？

Question

我有一个要显示在视频上的图标（下面的代码中带有i标记）。但是，当我在视频标签中添加css类名（以执行转换以镜像视频）时，该图标不再显示。另外，在代码中，当我添加视频类名时，下一个div中的图标和内容都不会显示。我希望能够既显示图标又具有视频标签的类名。

我知道在CSS类中添加！important会增加它们的特异性得分，但是据我所读，这不是解决此问题的最佳方法。

@app.route("/api/v1/actors?gender=<gender>", methods = ['GET'])
    def get_player(gender):
        ....

我想看到显示的视频同时显示div标签中的var和i标签中的图标。

Answer 1

首先，className不是有效的html标记属性，它是javascript中dom对象的属性。您应该使用的是：

<i class="iconClass" />

此外，i和video标签都需要关闭：

<i class="iconClass"></i>
<video class="videoClass" ...></video>

只有 空元素 可以在开始标记的结尾处关闭。 HTML中的 空元素 如下：

<area>
<base>
<br>
<col>
<embed>
<hr>
<img>
<input>
<keygen>(HTML 5.2 Draft removed)
<link>
<meta>
<param>
<source>
<track>
<wbr>