bootstrap自适应视频播放详情页内容页效果-html代码-BFW代码库

bootstrap自适应视频播放详情页内容页效果

代码语言：html

代码描述：bootstrap自适应视频播放详情页内容页效果

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link type="text/css" rel="stylesheet" href="http://repo.bfw.wiki/bfwrepo/css/font-awesome-4.7.0/css/font-awesome.min.css">
<link type="text/css" rel="stylesheet" href="http://repo.bfw.wiki/bfwrepo/css/bulma-0.3.1.css">
    <style>
        body {
            font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
        }

        .has-text-muted {
            color: #95A5A6;
        }

        .spacer {
            height: 20px;
        }

        .nav-left .searchbox {
            margin-top: 10px;
        }

        .avatar-photo {
            border-radius: 50px;
        }

        .video-title {
            font-size: 1.5em;
            font-weight: 500;
        }

        .box.video-description {
            padding: 20px 20px 5px 20px;
        }

        .video-description-more {
            font-size: 12px;
            font-weight: bold;
            text-transform: uppercase;
            margin-top: -15px;
        }

        .related-card .video-title {
            display: block;
            font-size: 13px;
            font-weight: 500;
        }

        .related-card .video-account, .related-card .video-views {
            display: block;
            font-size: 11px;
            color: #95A5A6;
        }

        .related-card img {
            height: 68px;
        }

        .related-card.media .media, .related-card.media + .media {
            border-top: none;
        }

        .related-list .autoplay {
            padding-bottom: 10px;
        }

        .related-list .autoplay .autoplay-title {
            font-weight: bold;
        }

        .related-list .autoplay .autoplay-toggle {
            float: right;
        }

        .related-list .autoplay .autoplay-toggle .fa {
            font-size: 13px;
            padding: 5px 10px;
        }
    </style>

</head>
<body translate="no">

    <nav class="nav has-shadow" id="top">
        <div class="container">
            <div class="nav-left">
                <a class="nav-item" href="/">
                    <img src="http://repo.bfw.wiki/bfwrepo/icon/5d834ea6be5b9.png" alt=".........完整代码请登录后点击上方下载按钮下载查看