=XHG78999= 2021-05-15 09:50 采纳率: 100%
浏览 498
已结题

Video.js CSS引入成功但无法正常显示

如题,我在用video.js做一个小小的播放器,但是样式一直失效,查看Network却显示CSS请求正常。

我完全学着网上其他用这玩意的引入的!!!

Code:

<!DOCTYPE html>
<html>
    <head>
        <title>视频播放器</title>
        <link rel="stylesheet" href="./assets/css/main.css">
        <link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/font-awesome/4.7.0/css/font-awesome.css">
        <link href="https://cdn.bootcss.com/video.js/7.6.5/video-js.min.css" rel="stylesheet">
        <script src="./player/js/jquery.min.js"></script>
        <script src="https://cdn.bootcss.com/video.js/7.6.5/video.min.js"></script>
        <script src="https://cdn.bootcss.com/video.js/7.6.5/lang/zh-CN.js"></script>
        <script src="https://cdn.bootcss.com/videojs-contrib-hls/5.15.0/videojs-contrib-hls.min.js"></script>
    </head>
    <body>
        <div class="header">
            <div class="header-wrapper">
                <div class="header-lookup">
                    <p class="title">视频播放器</p>
                </div>
                <nav class="header-nav">
                    <ul class="header-nav-list">
                        <li class="header-nav-list-option">
                            <a class="header-nav-link" href="#">使用教程</a>
                        </li>
                    </ul>
                </nav>
            </div>
        </div>
        <div class="container">
            <div class="player" id="player">
                <video id="video" class="video" controls></video>
            </div>
            <table class="form-table" align="center">
                <tr>
                    <td>
                        <input class="input" type="text" placeholder="视频的URL地址">
                    </td>
                    <td>
                        <button class="button"><i class="fa fa-play-circle-o"></i> 播放</button>
                    </td>
            </table>
        </div>
    </body>
</html>

显示:

我该怎么做?

  • 写回答

4条回答 默认 最新

  • CSDN专家-showbo 2021-05-15 12:45
    关注

    要给video标签添加video-js样式就行了~~

    <video id="video" class="video-js" controls></video>
    <script>
            var player = videojs('video');
        </script>

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(3条)

报告相同问题?

问题事件

  • 已结题 (查看结题原因) 12月16日

悬赏问题

  • ¥15 装 pytorch 的时候出了好多问题,遇到这种情况怎么处理?
  • ¥20 IOS游览器某宝手机网页版自动立即购买JavaScript脚本
  • ¥15 手机接入宽带网线,如何释放宽带全部速度
  • ¥30 关于#r语言#的问题:如何对R语言中mfgarch包中构建的garch-midas模型进行样本内长期波动率预测和样本外长期波动率预测
  • ¥15 ETLCloud 处理json多层级问题
  • ¥15 matlab中使用gurobi时报错
  • ¥15 这个主板怎么能扩出一两个sata口
  • ¥15 不是,这到底错哪儿了😭
  • ¥15 2020长安杯与连接网探
  • ¥15 关于#matlab#的问题:在模糊控制器中选出线路信息,在simulink中根据线路信息生成速度时间目标曲线(初速度为20m/s,15秒后减为0的速度时间图像)我想问线路信息是什么