web期末作业网页设计(网页源码)——CSGO

大学生网页制作期末作业-HTML+CSS+JavaScript(包含源码)-游戏网站CSGO

Logo
设定
特色
武器品质
磨损程度
武器装备
csgo
Counter-Strike: Global Offensive
背景设定
Counter Terrorists/CT
海豹部队第6分队
特种应变部队
英国空降特勤队
下载
背景设定
游戏是以1999年的“CS”为原型制作的新作,该作在团队竞技游戏模式的基础上加以开发。
游戏将玩家分为反恐精英(Counter Terrorists/CT)阵营与恐怖分子(Terrorists/T)阵营两队,每个队伍必须在一个地图上进行多回合的战斗。赢得回合的方法是达到该地图要求的目标,或者是完全消灭敌方玩家。

《反恐精英:全球攻势》
包含全新地图,角色与武器,同时将向经典CS发布升级。另外,游戏还引入全新的游戏模式,竞技配对系统,排行榜等。新的对战模式分为休闲和竞技两种。在休闲模式中,玩家的攻击将不会对队友造成误伤,可以跨团队和敌方聊天,系统还将自动为人物穿上防弹衣。

角色设定
每局对战随机阵营,玩家可以选择己方阵营下的角色,部分角色需要通过解锁。

海豹部队第6分队(SEAL TEAM 6)
美国海军特战开发小组(DEVGRU)
特种应变部队
特种武器战术部队
美国国内警察执法机构
英国空降特勤队

德国的精英反恐力量
2021
HD
128 min
3.5

The 法国宪兵特勤队
2021
4K
128 min
3.5

The 以色列国防军
2021
HD
128 min
3.5

The 凤凰恐怖组织
2021
8K
128 min
3.5

分离主义者
2021
3D
128 min
3.5

专业人士
2021
HD
128 min
3.9

自由佣兵
2021
4K
128 min
3.9

The 海盗(PIRATE)
2021
4K
128 min
3.9
海豹部队第6分队(SEAL TEAM 6)
海豹部队第六分队(ST-6)现为美国海军特战开发小组(DEVGRU),由理查马辛克中尉于 1980 年成立。海豹部队第六分队永远保持警戒状态随时回应世界各地以美国为目标的恐怖攻击行动。
特种应变部队(SRT)或称作特种武器战术部队(SWAT),隶属于美国国内警察执法机构的特种军事作战部队专门执行危险任务。

CSGO
2
0
K+
特种应变部队(Special Response Team)

渗透到敌方阵营
偷取情报

破坏敌方建设
2021
HD
128 min
3.5

The 刺杀重要目标
2021
4K
128 min
3.5

德国联邦警察
2021
HD
128 min
3.5

法国宪兵特勤队
2021
HD
128 min
3.5
英国空降特勤队
举世闻名的英国空降特勤队(SAS)是在第二次世界大战期间,由一位名叫大卫史坦宁的人所创设的部队。.

Enter your email

设定
特色
武器品质
磨损程度
武器装备
Find Favorite Movie

设定
特色
武器品质
武器装备
Counter-Strike: Global Offensive反恐精英全球攻势

img
<!doctype html>

Counter-Strike: Global Offensive
	<link rel="shortcut icon" type="image/x-icon" href="img/favicon.png">
    <!-- Place favicon.ico in the root directory -->

	<!-- CSS here -->
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/animate.min.css">
    <link rel="stylesheet" href="css/magnific-popup.css">
    <link rel="stylesheet" href="css/fontawesome-all.min.css">
    <link rel="stylesheet" href="css/owl.carousel.min.css">
    <link rel="stylesheet" href="css/flaticon.css">
    <link rel="stylesheet" href="css/odometer.css">
    <link rel="stylesheet" href="css/aos.css">
    <link rel="stylesheet" href="css/slick.css">
    <link rel="stylesheet" href="css/default.css">
    <link rel="stylesheet" href="css/style.css">
    <link rel="stylesheet" href="css/responsive.css">
</head>
<body>

    <!-- preloader -->
    <div id="preloader">
        <div id="loading-center">
            <div id="loading-center-absolute">
                <img src="img/preloader.svg" alt="">
            </div>
        </div>
    </div>
    <!-- preloader-end -->

	<!-- Scroll-top -->
    <button class="scroll-top scroll-to-target" data-target="html">
        <i class="fas fa-angle-up"></i>
    </button>
    <!-- Scroll-top-end-->

    <!-- header-area -->
    <header>
        <div id="sticky-header" class="menu-area transparent-header">
            <div class="container custom-container">
                <div class="row">
                    <div class="col-12">
                      <div class="mobile-nav-toggler"><i class="fas fa-bars"></i></div>
                        <div class="menu-wrap">
                            <nav class="menu-nav show">
                                <div class="logo">
                                    <a href="index.html">
                                        <img src="img/logo/logo.png" alt="Logo">
                                    </a>
                                </div>
                                <div class="navbar-wrap main-menu d-none d-lg-flex">
                                    <ul class="navigation">
                                        <li class="active menu-item-has-children"><a href="#">设定</a>
                                            <ul class="submenu">
                                                <li class="active"><a href="index.html">背景设定</a></li>
                                                <li><a href="index-2.html">角色设定</a></li>
                                            </ul>
                                        </li>
                                        <li class="menu-item-has-children"><a href="#"> 特色</a>
                                            <ul class="submenu">
                                                <li><a href="movie.html">物品道具</a></li>
                                                <li><a href="movie-details.html">场景地图</a></li>
                                            </ul>
                                        </li>
                                        <li><a href="tv-show.html">武器品质</a></li>
                                        <li><a href="pricing.html">磨损程度</a></li>
                                        <li class="menu-item-has-children"><a href="#">武器装备</a>
                                            <ul class="submenu">
                                                <li><a href="blog.html">主武器</a></li>
                                                <li><a href="blog-details.html">特殊装备</a></li>
                                            </ul>
                                        </li>
                                        
                                    </ul>
                                </div>
                                <div class="header-action d-none d-md-block">
                                    <ul>
                                        <li class="header-search"><a href="#" data-toggle="modal" data-target="#search-modal"><i class="fas fa-search"></i></a></li>
                                        <li class="header-lang">
                                           
                                        </li>
                                        <li class="header-btn"><a href="#" class="btn">加入</a></li>
                                    </ul>
                                </div>
                            </nav>
                        </div>

                        <!-- Mobile Menu  -->
                        <div class="mobile-menu">
                            <div class="close-btn"><i class="fas fa-times"></i></div>

                            <nav class="menu-box">
                                <div class="nav-logo"><a href="index.html"><img src="img/logo/logo.png" alt="" title=""></a>
                                </div>
                                <div class="menu-outer">
                                    <!--Here Menu Will Come Automatically Via Javascript / Same Menu as in Header-->
                                </div>
                                <div class="social-links">
                                    <ul class="clearfix">
                                        <li><a href="#"><span class="fab fa-twitter"></span></a></li>
                                        <li><a href="#"><span class="fab fa-facebook-square"></span></a></li>
                                        <li><a href="#"><span class="fab fa-pinterest-p"></span></a></li>
                                        <li><a href="#"><span class="fab fa-instagram"></span></a></li>
                                        <li><a href="#"><span class="fab fa-youtube"></span></a></li>
                                    </ul>
                                </div>
                            </nav>
                        </div>
                        <div class="menu-backdrop"></div>
                        <!-- End Mobile Menu -->

                        <!-- Modal Search -->
                        <div class="modal fade" id="search-modal" tabindex="-1" role="dialog" aria-hidden="true">
                            <div class="modal-dialog" role="document">
                                <div class="modal-content">
                                    <form>
                                        <input type="text" placeholder="Search here...">
                                        <button><i class="fas fa-search"></i></button>
                                    </form>
                                </div>
                            </div>
                        </div>
                        <!-- Modal Search-end -->

                    </div>
                </div>
            </div>
        </div>
    </header>
    <!-- header-area-end -->


    <!-- main-area -->
    <main>

        <!-- banner-area -->
        <section class="banner-area banner-bg" data-background="img/banner/banner_bg01.jpg">
            <div class="container custom-container">
                <div class="row">
                    <div class="col-xl-6 col-lg-8">
                        <div class="banner-content">
                            <h6 class="sub-title wow fadeInUp" data-wow-delay=".2s" data-wow-duration="1.8s">csgo</h6>
                            <h2 class="title wow fadeInUp" data-wow-delay=".4s" data-wow-duration="1.8s">Counter-Strike: Global Offensive</h2>
                            <div class="banner-meta wow fadeInUp" data-wow-delay=".6s" data-wow-duration="1.8s">
                                <ul>
                                   
                                    <li class="release-time">
                                       
                                    </li>
                                </ul>
                            </div>
                            <a href="#" class="banner-btn btn popup-video wow fadeInUp" data-wow-delay=".8s" data-wow-duration="1.8s"><i class="fas fa-play"></i> CS:GO</a>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- banner-area-end -->

        <!-- up-coming-movie-area -->
        <section class="ucm-area ucm-bg" data-background="img/bg/ucm_bg.jpg">
            <div class="ucm-bg-shape" data-background="img/bg/ucm_bg_shape.png"></div>
            <div class="container">
                <div class="row align-items-end mb-55">
                    <div class="col-lg-6">
                        <div class="section-title text-center text-lg-left">
                            <span class="sub-title">背景设定</span>
                            <h2 class="title">Counter Terrorists/CT</h2>
                        </div>
                    </div>
                    <div class="col-lg-6">
                        <div class="ucm-nav-wrap">
                            <ul class="nav nav-tabs" id="myTab" role="tablist">
                                <li class="nav-item" role="presentation">
                                    <a class="nav-link active" id="tvShow-tab" data-toggle="tab" href="#tvShow" role="tab" aria-controls="tvShow" aria-selected="true">海豹部队第6分队</a>
                                </li>
                                <li class="nav-item" role="presentation">
                                    <a class="nav-link" id="movies-tab" data-toggle="tab" href="#movies" role="tab" aria-controls="movies" aria-selected="false">特种应变部队</a>
                                </li>
                                <li class="nav-item" role="presentation">
                                    <a class="nav-link" id="anime-tab" data-toggle="tab" href="#anime" role="tab" aria-controls="anime" aria-selected="false">英国空降特勤队</a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="tab-content" id="myTabContent">
                    <div class="tab-pane fade show active" id="tvShow" role="tabpanel" aria-labelledby="tvShow-tab">
                        <div class="ucm-active owl-carousel">
                            <div class="movie-item mb-50">
                                <div class="movie-poster">
                                    <a href="movie-details.html"><img src="img/poster/ucm_poster01.jpg" alt=""></a>
                                </div>
                                <div class="movie-content">
                                    <div class="top">
                                        <h5 class="title"><a href="movie-details.html">德国第9边境防卫队</a></h5>
                                        <span class="date">2021</span>
                                    </div>
                                    <div class="bottom">
                                        <ul>
                                            <li><span class="quality">hd</span></li>
                                            <li>
                                                <span class="duration"><i class="far fa-clock"></i> 128 min</span>
                                                <span class="rating"><i class="fas fa-thumbs-up"></i> 3.5</span>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                            <div class="movie-item mb-50">
                                <div class="movie-poster">
                                    <a href="movie-details.html"><img src="img/poster/ucm_poster02.jpg" alt=""></a>
                                </div>
                                <div class="movie-content">
                                    <div class="top">
                                        <h5 class="title"><a href="movie-details.html">法国宪兵特勤队</a></h5>
                                        <span class="date">2021</span>
                                    </div>
                                    <div class="bottom">
                                        <ul>
                                            <li><span class="quality">4k</span></li>
                                            <li>
                                                <span class="duration"><i class="far fa-clock"></i> 128 min</span>
                                                <span class="rating"><i class="fas fa-thumbs-up"></i> 3.5</span>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                            <div class="movie-item mb-50">
                                <div class="movie-poster">
                                    <a href="movie-details.html"><img src="img/poster/ucm_poster03.jpg" alt=""></a>
                                </div>
                                <div class="movie-content">
                                    <div class="top">
                                        <h5 class="title"><a href="movie-details.html">以色列国防军</a></h5>
                                        <span class="date">2021</span>
                                    </div>
                                    <div class="bottom">
                                        <ul>
                                            <li><span class="quality">hd</span></li>
                                            <li>
                                                <span class="duration"><i class="far fa-clock"></i> 128 min</span>
                                                <span class="rating"><i class="fas fa-thumbs-up"></i> 3.5</span>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                            <div class="movie-item mb-50">
                                <div class="movie-poster">
                                    <a href="movie-details.html"><img src="img/poster/ucm_poster04.jpg" alt=""></a>
                                </div>
                                <div class="movie-content">
                                    <div class="top">
                                        <h5 class="title"><a href="movie-details.html">凤凰恐怖组织</a></h5>
                                        <span class="date">2021</span>
                                    </div>
                                    <div class="bottom">
                                        <ul>
                                            <li><span class="quality">8k</span></li>
                                            <li>
                                                <span class="duration"><i class="far fa-clock"></i> 128 min</span>
                                                <span class="rating"><i class="fas fa-thumbs-up"></i> 3.5</span>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                            <div class="movie-item mb-50">
                                <div class="movie-poster">
                                    <a href="movie-details.html"><img src="img/poster/ucm_poster05.jpg" alt=""></a>
                                </div>
                                <div class="movie-content">
                                    <div class="top">
                                        <h5 class="title"><a href="movie-details.html">分离主义者</a></h5>
                                        <span class="date">2021</span>
                                    </div>
                                    <div class="bottom">
                                        <ul>
                                            <li><span class="quality">hd</span></li>
                                            <li>
                                                <span class="duration"><i class="far fa-clock"></i> 128 min</span>
                                                <span class="rating"><i class="fas fa-thumbs-up"></i> 3.5</span>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="tab-pane fade" id="movies" role="tabpanel" aria-labelledby="movies-tab">
                        <div class="ucm-active owl-carousel">
                            <div class="movie-item mb-50">
                                <div class="movie-poster">
                                    <a href="movie-details.html"><img src="img/poster/ucm_poster05.jpg" alt=""></a>
                                </div>
                                <div class="movie-content">
                                    <div class="top">
                                        <h5 class="title"><a href="movie-details.html">海盗(PIRATE)</a></h5>
                                        <span class="date">2021</span>
                                    </div>
                                    <div class="bottom">
                                        <ul>
                                            <li><span class="quality">hd</span></li>
                                            <li>
                                                <span class="duration"><i class="far fa-clock"></i> 128 min</span>
                                                <span class="rating"><i class="fas fa-thumbs-up"></i> 3.5</span>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                            <div class="movie-item mb-50">
                                <div class="movie-poster">
                                    <a href="movie-details.html"><img src="img/poster/ucm_poster06.jpg" alt=""></a>
                                </div>
                                <div class="movie-content">
                                    <div class="top">
                                        <h5 class="title"><a href="movie-details.html">专业人士</a></h5>
                                        <span class="date">2021</span>
                                    </div>
                                    <div class="bottom">
                                        <ul>
                                            <li><span class="quality">4k</span></li>
                                            <li>
                                                <span class="duration"><i class="far fa-clock"></i> 128 min</span>
                                                <span class="rating"><i class="fas fa-thumbs-up"></i> 3.5</span>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                            <div class="movie-item mb-50">
                                <div class="movie-poster">
                                    <a href="movie-details.html"><img src="img/poster/ucm_poster07.jpg" alt=""></a>
                                </div>
                                <div class="movie-content">
                                    <div class="top">
                                        <h5 class="title"><a href="movie-details.html">自由佣兵</a></h5>
                                        <span class="date">2021</span>
                                    </div>
                                    <div class="bottom">
                                        <ul>
                                            <li><span class="quality">hd</span></li>
                                            <li>
                                                <span class="duration"><i class="far fa-clock"></i> 128 min</span>
                                                <span class="rating"><i class="fas fa-thumbs-up"></i> 3.5</span>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                            <div class="movie-item mb-50">
                                <div class="movie-poster">
                                    <a href="movie-details.html"><img src="img/poster/ucm_poster08.jpg" alt=""></a>
                                </div>
                                <div class="movie-content">
                                    <div class="top">
                                        <h5 class="title"><a href="movie-details.html">CS阵营</a></h5>
                                        <span class="date">2021</span>
                                    </div>
                                    <div class="bottom">
                                        <ul>
                                            <li><span class="quality">4k</span></li>
                                            <li>
                                                <span class="duration"><i class="far fa-clock"></i> 128 min</span>
                                                <span class="rating"><i class="fas fa-thumbs-up"></i> 3.5</span>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                            <div class="movie-item mb-50">
                                <div class="movie-poster">
                                    <a href="movie-details.html"><img src="img/poster/ucm_poster03.jpg" alt=""></a>
                                </div>
                                <div class="movie-content">
                                    <div class="top">
                                        <h5 class="title"><a href="movie-details.html">SRT角色</a></h5>
                                        <span class="date">2021</span>
                                    </div>
                                    <div class="bottom">
                                        <ul>
                                            <li><span class="quality">hd</span></li>
                                            <li>
                                                <span class="duration"><i class="far fa-clock"></i> 128 min</span>
                                                <span class="rating"><i class="fas fa-thumbs-up"></i> 3.5</span>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="tab-pane fade" id="anime" role="tabpanel" aria-labelledby="anime-tab">
                        <div class="ucm-active owl-carousel">
                            <div class="movie-item mb-50">
                                <div class="movie-poster">
                                    <a href="movie-details.html"><img src="img/poster/ucm_poster01.jpg" alt=""></a>
                                </div>
                                <div class="movie-content">
                                    <div class="top">
                                        <h5 class="title"><a href="movie-details.html">恐怖分子阵营</a></h5>
                                        <span class="date">2021</span>
                                    </div>
                                    <div class="bottom">
                                        <ul>
                                            <li><span class="quality">hd</span></li>
                                            <li>
                                                <span class="duration"><i class="far fa-clock"></i> 128 min</span>
                                                <span class="rating"><i class="fas fa-thumbs-up"></i> 3.5</span>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                            <div class="movie-item mb-50">
                                <div class="movie-poster">
                                    <a href="movie-details.html"><img src="img/poster/ucm_poster02.jpg" alt=""></a>
                                </div>
                                <div class="movie-content">
                                    <div class="top">
                                        <h5 class="title"><a href="movie-details.html">Professional </a></h5>
                                        <span class="date">2021</span>
                                    </div>
                                    <div class="bottom">
                                        <ul>
                                            <li><span class="quality">4k</span></li>
                                            <li>
                                                <span class="duration"><i class="far fa-clock"></i> 128 min</span>
                                                <span class="rating"><i class="fas fa-thumbs-up"></i> 3.5</span>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                            <div class="movie-item mb-50">
                                <div class="movie-poster">
                                    <a href="movie-details.html"><img src="img/poster/ucm_poster03.jpg" alt=""></a>
                                </div>
                                <div class="movie-content">
                                    <div class="top">
                                        <h5 class="title"><a href="movie-details.html">Freelancers</a></h5>
                                        <span class="date">2021</span>
                                    </div>
                                    <div class="bottom">
                                        <ul>
                                            <li><span class="quality">hd</span></li>
                                            <li>
                                                <span class="duration"><i class="far fa-clock"></i> 128 min</span>
                                                <span class="rating"><i class="fas fa-thumbs-up"></i> 3.5</span>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                            <div class="movie-item mb-50">
                                <div class="movie-poster">
                                    <a href="movie-details.html"><img src="img/poster/ucm_poster04.jpg" alt=""></a>
                                </div>
                                <div class="movie-content">
                                    <div class="top">
                                        <h5 class="title"><a href="movie-details.html">T阵营(恐怖分子)</a></h5>
                                        <span class="date">2021</span>
                                    </div>
                                    <div class="bottom">
                                        <ul>
                                            <li><span class="quality">8k</span></li>
                                            <li>
                                                <span class="duration"><i class="far fa-clock"></i> 128 min</span>
                                                <span class="rating"><i class="fas fa-thumbs-up"></i> 3.5</span>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                            <div class="movie-item mb-50">
                                <div class="movie-poster">
                                    <a href="movie-details.html"><img src="img/poster/ucm_poster05.jpg" alt=""></a>
                                </div>
                                <div class="movie-content">
                                    <div class="top">
                                        <h5 class="title"><a href="movie-details.html">CT阵营(反恐精英)</a></h5>
                                        <span class="date">2021</span>
                                    </div>
                                    <div class="bottom">
                                        <ul>
                                            <li><span class="quality">hd</span></li>
                                            <li>
                                                <span class="duration"><i class="far fa-clock"></i> 128 min</span>
                                                <span class="rating"><i class="fas fa-thumbs-up"></i> 3.5</span>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- up-coming-movie-area-end -->

        <!-- services-area -->
        <section class="services-area services-bg" data-background="img/bg/services_bg.jpg">
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-lg-6">
                        <div class="services-img-wrap">
                            <img src="img/images/services_img.jpg" alt="">
                            <a href="img/images/services_img.jpg" class="download-btn" download>下载 <img src="fonts/download.svg" alt=""></a>
                        </div>
                    </div>
                    <div class="col-lg-6">
                        <div class="services-content-wrap">
                            <div class="section-title title-style-two mb-20">
                                <span class="sub-title">背景设定</span>
                                <h2 class="title">游戏是以1999年的“CS”为原型制作的新作,该作在团队竞技游戏模式的基础上加以开发。</h2>
                            </div>
                            <p>游戏将玩家分为反恐精英(Counter Terrorists/CT)阵营与恐怖分子(Terrorists/T)阵营两队,每个队伍必须在一个地图上进行多回合的战斗。赢得回合的方法是达到该地图要求的目标,或者是完全消灭敌方玩家。</p>
                            <div class="services-list">
                                <ul>
                                    <li>
                                        <div class="icon">
                                            <i class="flaticon-television"></i>
                                        </div>
                                        <div class="content">
                                            <h5>《反恐精英:全球攻势》</h5>
                                            <p>包含全新地图,角色与武器,同时将向经典CS发布升级。另外,游戏还引入全新的游戏模式,竞技配对系统,排行榜等。新的对战模式分为休闲和竞技两种。在休闲模式中,玩家的攻击将不会对队友造成误伤,可以跨团队和敌方聊天,系统还将自动为人物穿上防弹衣。</p>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="icon">
                                            <i class="flaticon-video-camera"></i>
                                        </div>
                                        <div class="content">
                                            <h5>角色设定</h5>
                                            <p>每局对战随机阵营,玩家可以选择己方阵营下的角色,部分角色需要通过解锁。</p>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- services-area-end -->

        <!-- top-rated-movie -->
        <section class="top-rated-movie tr-movie-bg" data-background="img/bg/tr_movies_bg.jpg">
            <div class="container">
                <div class="row justify-content-center">
                    <div class="col-lg-8">
                        <div class="section-title text-center mb-50">
                            <span class="sub-title">海豹部队第6分队(SEAL TEAM 6)</span>
                            <h2 class="title">美国海军特战开发小组(DEVGRU)</h2>
                        </div>
                    </div>
                </div>
                <div class="row justify-content-center">
                    <div class="col-lg-8">
                        <div class="tr-movie-menu-active text-center">
                            <button class="active" data-filter="*">特种应变部队</button>
                            <button class="" data-filter=".cat-one">特种武器战术部队</button>
                            <button class="" data-filter=".cat-two">美国国内警察执法机构</button>
                            <button class="" data-filter=".cat-three">英国空降特勤队</button>
                        </div>
                    </div>
                </div>
                <div class="row tr-movie-active">
                    <div class="col-xl-3 col-lg-4 col-sm-6 grid-item grid-sizer cat-two">
                        <div class="movie-item mb-60">
                            <div class="movie-poster">
                                <a href="movie-details.html"><img src="img/poster/ucm_poster01.jpg" alt=""></a>
                            </div>
                            <div class="movie-content">
                                <div class="top">
                                    <h5 class="title"><a href="movie-details.html">德国的精英反恐力量</a></h5>
                                    <span class="date">2021</span>
                                </div>
                                <div class="bottom">
                                    <ul>
                                        <li><span class="quality">hd</span></li>
                                        <li>
                                            <span class="duration"><i class="far fa-clock"></i> 128 min</span>
                                            <span class="rating"><i class="fas fa-thumbs-up"></i> 3.5</span>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-3 col-lg-4 col-sm-6 grid-item grid-sizer cat-one cat-three">
                        <div class="movie-item mb-60">
                            <div class="movie-poster">
                                <a href="movie-details.html"><img src="img/poster/ucm_poster02.jpg" alt=""></a>
                            </div>
                            <div class="movie-content">
                                <div class="top">
                                    <h5 class="title"><a href="movie-details.html">The 法国宪兵特勤队</a></h5>
                                    <span class="date">2021</span>
                                </div>
                                <div class="bottom">
                                    <ul>
                                        <li><span class="quality">4k</span></li>
                                        <li>
                                            <span class="duration"><i class="far fa-clock"></i> 128 min</span>
                                            <span class="rating"><i class="fas fa-thumbs-up"></i> 3.5</span>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-3 col-lg-4 col-sm-6 grid-item grid-sizer cat-two">
                        <div class="movie-item mb-60">
                            <div class="movie-poster">
                                <a href="movie-details.html"><img src="img/poster/ucm_poster03.jpg" alt=""></a>
                            </div>
                            <div class="movie-content">
                                <div class="top">
                                    <h5 class="title"><a href="movie-details.html">The 以色列国防军</a></h5>
                                    <span class="date">2021</span>
                                </div>
                                <div class="bottom">
                                    <ul>
                                        <li><span class="quality">hd</span></li>
                                        <li>
                                            <span class="duration"><i class="far fa-clock"></i> 128 min</span>
                                            <span class="rating"><i class="fas fa-thumbs-up"></i> 3.5</span>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-3 col-lg-4 col-sm-6 grid-item grid-sizer cat-one cat-three">
                        <div class="movie-item mb-60">
                            <div class="movie-poster">
                                <a href="movie-details.html"><img src="img/poster/ucm_poster04.jpg" alt=""></a>
                            </div>
                            <div class="movie-content">
                                <div class="top">
                                    <h5 class="title"><a href="movie-details.html">The 凤凰恐怖组织</a></h5>
                                    <span class="date">2021</span>
                                </div>
                                <div class="bottom">
                                    <ul>
                                        <li><span class="quality">8K</span></li>
                                        <li>
                                            <span class="duration"><i class="far fa-clock"></i> 128 min</span>
                                            <span class="rating"><i class="fas fa-thumbs-up"></i> 3.5</span>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-3 col-lg-4 col-sm-6 grid-item grid-sizer cat-two">
                        <div class="movie-item mb-60">
                            <div class="movie-poster">
                                <a href="movie-details.html"><img src="img/poster/ucm_poster05.jpg" alt=""></a>
                            </div>
                            <div class="movie-content">
                                <div class="top">
                                    <h5 class="title"><a href="movie-details.html">分离主义者</a></h5>
                                    <span class="date">2021</span>
                                </div>
                                <div class="bottom">
                                    <ul>
                                        <li><span class="quality">3D</span></li>
                                        <li>
                                            <span class="duration"><i class="far fa-clock"></i> 128 min</span>
                                            <span class="rating"><i class="fas fa-thumbs-up"></i> 3.5</span>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-3 col-lg-4 col-sm-6 grid-item grid-sizer cat-one cat-three">
                        <div class="movie-item mb-60">
                            <div class="movie-poster">
                                <a href="movie-details.html"><img src="img/poster/ucm_poster06.jpg" alt=""></a>
                            </div>
                            <div class="movie-content">
                                <div class="top">
                                    <h5 class="title"><a href="movie-details.html">专业人士</a></h5>
                                    <span class="date">2021</span>
                                </div>
                                <div class="bottom">
                                    <ul>
                                        <li><span class="quality">hd</span></li>
                                        <li>
                                            <span class="duration"><i class="far fa-clock"></i> 128 min</span>
                                            <span class="rating"><i class="fas fa-thumbs-up"></i> 3.9</span>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-3 col-lg-4 col-sm-6 grid-item grid-sizer cat-two">
                        <div class="movie-item mb-60">
                            <div class="movie-poster">
                                <a href="movie-details.html"><img src="img/poster/ucm_poster07.jpg" alt=""></a>
                            </div>
                            <div class="movie-content">
                                <div class="top">
                                    <h5 class="title"><a href="movie-details.html">自由佣兵</a></h5>
                                    <span class="date">2021</span>
                                </div>
                                <div class="bottom">
                                    <ul>
                                        <li><span class="quality">4K</span></li>
                                        <li>
                                            <span class="duration"><i class="far fa-clock"></i> 128 min</span>
                                            <span class="rating"><i class="fas fa-thumbs-up"></i> 3.9</span>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-3 col-lg-4 col-sm-6 grid-item grid-sizer cat-one cat-three">
                        <div class="movie-item mb-60">
                            <div class="movie-poster">
                                <a href="movie-details.html"><img src="img/poster/ucm_poster08.jpg" alt=""></a>
                            </div>
                            <div class="movie-content">
                                <div class="top">
                                    <h5 class="title"><a href="movie-details.html">The 海盗(PIRATE)</a></h5>
                                    <span class="date">2021</span>
                                </div>
                                <div class="bottom">
                                    <ul>
                                        <li><span class="quality">4K</span></li>
                                        <li>
                                            <span class="duration"><i class="far fa-clock"></i> 128 min</span>
                                            <span class="rating"><i class="fas fa-thumbs-up"></i> 3.9</span>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- top-rated-movie-end -->

        <!-- live-area -->
        <section class="live-area live-bg fix" data-background="img/bg/live_bg.jpg">
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-xl-5 col-lg-6">
                        <div class="section-title title-style-two mb-25">
                            <span class="sub-title">海豹部队第6分队(SEAL TEAM 6)</span>
                            <h2 class="title">海豹部队第六分队(ST-6)现为美国海军特战开发小组(DEVGRU),由理查马辛克中尉于 1980 年成立。海豹部队第六分队永远保持警戒状态随时回应世界各地以美国为目标的恐怖攻击行动。</h2>
                        </div>
                        <div class="live-movie-content">
                            <p>特种应变部队(SRT)或称作特种武器战术部队(SWAT),隶属于美国国内警察执法机构的特种军事作战部队专门执行危险任务。</p>
                            <div class="live-fact-wrap">
                                <div class="resolution">
                                    <h2>CSGO</h2>
                                </div>
                                <div class="active-customer">
                                    <h4><span class="odometer" data-count="20"></span>K+</h4>
                                    <p>特种应变部队(Special Response Team)</p>
                                </div>
                            </div>
                            <a href="#" class="btn popup-video"><i class="fas fa-play"></i> 举世闻名</a>
                        </div>
                    </div>
                    <div class="col-xl-7 col-lg-6">
                        <div class="live-movie-img wow fadeInRight" data-wow-delay=".2s" data-wow-duration="1.8s">
                            <img src="img/images/live_img.png" alt="">
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- live-area-end -->

        <!-- tv-series-area -->
        <section class="tv-series-area tv-series-bg" data-background="img/bg/tv_series_bg.jpg">
            <div class="container">
                <div class="row justify-content-center">
                    <div class="col-lg-8">
                        <div class="section-title text-center mb-50">
                            <span class="sub-title">渗透到敌方阵营</span>
                            <h2 class="title">偷取情报</h2>
                        </div>
                    </div>
                </div>
                <div class="row justify-content-center">
                    <div class="col-xl-3 col-lg-4 col-sm-6">
                        <div class="movie-item mb-50">
                            <div class="movie-poster">
                                <a href="movie-details.html"><img src="img/poster/ucm_poster09.jpg" alt=""></a>
                            </div>
                            <div class="movie-content">
                                <div class="top">
                                    <h5 class="title"><a href="movie-details.html">破坏敌方建设</a></h5>
                                    <span class="date">2021</span>
                                </div>
                                <div class="bottom">
                                    <ul>
                                        <li><span class="quality">hd</span></li>
                                        <li>
                                            <span class="duration"><i class="far fa-clock"></i> 128 min</span>
                                            <span class="rating"><i class="fas fa-thumbs-up"></i> 3.5</span>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-3 col-lg-4 col-sm-6">
                        <div class="movie-item mb-50">
                            <div class="movie-poster">
                                <a href="movie-details.html"><img src="img/poster/ucm_poster10.jpg" alt=""></a>
                            </div>
                            <div class="movie-content">
                                <div class="top">
                                    <h5 class="title"><a href="movie-details.html">The 刺杀重要目标</a></h5>
                                    <span class="date">2021</span>
                                </div>
                                <div class="bottom">
                                    <ul>
                                        <li><span class="quality">4k</span></li>
                                        <li>
                                            <span class="duration"><i class="far fa-clock"></i> 128 min</span>
                                            <span class="rating"><i class="fas fa-thumbs-up"></i> 3.5</span>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-3 col-lg-4 col-sm-6">
                        <div class="movie-item mb-50">
                            <div class="movie-poster">
                                <a href="movie-details.html"><img src="img/poster/ucm_poster03.jpg" alt=""></a>
                            </div>
                            <div class="movie-content">
                                <div class="top">
                                    <h5 class="title"><a href="movie-details.html">德国联邦警察</a></h5>
                                    <span class="date">2021</span>
                                </div>
                                <div class="bottom">
                                    <ul>
                                        <li><span class="quality">hd</span></li>
                                        <li>
                                            <span class="duration"><i class="far fa-clock"></i> 128 min</span>
                                            <span class="rating"><i class="fas fa-thumbs-up"></i> 3.5</span>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-3 col-lg-4 col-sm-6">
                        <div class="movie-item mb-50">
                            <div class="movie-poster">
                                <a href="movie-details.html"><img src="img/poster/ucm_poster04.jpg" alt=""></a>
                            </div>
                            <div class="movie-content">
                                <div class="top">
                                    <h5 class="title"><a href="movie-details.html">法国宪兵特勤队</a></h5>
                                    <span class="date">2021</span>
                                </div>
                                <div class="bottom">
                                    <ul>
                                        <li><span class="quality">hd</span></li>
                                        <li>
                                            <span class="duration"><i class="far fa-clock"></i> 128 min</span>
                                            <span class="rating"><i class="fas fa-thumbs-up"></i> 3.5</span>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- tv-series-area-end -->

        <!-- newsletter-area -->
        <section class="newsletter-area newsletter-bg" data-background="img/bg/newsletter_bg.jpg">
            <div class="container">
                <div class="newsletter-inner-wrap">
                    <div class="row align-items-center">
                        <div class="col-lg-6">
                            <div class="newsletter-content">
                                <h4>英国空降特勤队</h4>
                                <p>举世闻名的英国空降特勤队(SAS)是在第二次世界大战期间,由一位名叫大卫史坦宁的人所创设的部队。.</p>
                            </div>
                        </div>
                        <div class="col-lg-6">
                            <form action="#" class="newsletter-form">
                                <input type="email" required placeholder="Enter your email">
                                <button class="btn">发送评价到我们的邮箱</button>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- newsletter-area-end -->

    </main>
    <!-- main-area-end -->


    <!-- footer-area -->
    <footer>
        <div class="footer-top-wrap">
            <div class="container">
                <div class="footer-menu-wrap">
                    <div class="row align-items-center">
                        <div class="col-lg-3">
                            <div class="footer-logo">
                                <a href="index.html"><img src="img/logo/logo.png" alt=""></a>
                            </div>
                        </div>
                        <div class="col-lg-9">
                            <div class="footer-menu">
                                <nav>
                                    <ul class="navigation">
                                        <li><a href="index.html">设定</a></li>
                                        <li><a href="index.html">特色</a></li>
                                        <li><a href="index.html">武器品质</a></li>
                                        <li><a href="index.html">磨损程度</a></li>
                                        <li><a href="pricing.html">武器装备</a></li>
                                    </ul>
                                    <div class="footer-search">
                                        <form action="#">
                                            <input type="text" placeholder="Find Favorite Movie">
                                            <button><i class="fas fa-search"></i></button>
                                        </form>
                                    </div>
                                </nav>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="footer-quick-link-wrap">
                    <div class="row align-items-center">
                        <div class="col-md-7">
                            <div class="quick-link-list">
                                <ul>
                                    <li><a href="#">设定</a></li>
                                    <li><a href="#">特色</a></li>
                                    <li><a href="#">武器品质</a></li>
                                    <li><a href="#">武器装备</a></li>
                                </ul>
                            </div>
                        </div>
                        <div class="col-md-5">
                            <div class="footer-social">
                                <ul>
                                    <li><a href="#"><i class="fab fa-facebook-f"></i></a></li>
                                    <li><a href="#"><i class="fab fa-twitter"></i></a></li>
                                    <li><a href="#"><i class="fab fa-pinterest-p"></i></a></li>
                                    <li><a href="#"><i class="fab fa-linkedin-in"></i></a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="copyright-wrap">
            <div class="container">
                <div class="row">
                    <div class="col-lg-6 col-md-6">
                        <div class="copyright-text">
                            <p>Counter-Strike: Global Offensive<a target="_blank" href="https://www.csgo.com.cn/main.html">反恐精英全球攻势</a></p>
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-6">
                        <div class="payment-method-img text-center text-md-right">
                            <img src="img/images/card_img.png" alt="img">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </footer>
    <!-- footer-area-end -->





	<!-- JS here -->
    <script src="js/vendor/jquery-3.6.0.min.js"></script>
    <script src="js/popper.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/isotope.pkgd.min.js"></script>
    <script src="js/imagesloaded.pkgd.min.js"></script>
    <script src="js/jquery.magnific-popup.min.js"></script>
    <script src="js/owl.carousel.min.js"></script>
    <script src="js/jquery.odometer.min.js"></script>
    <script src="js/jquery.appear.js"></script>
    <script src="js/slick.min.js"></script>
    <script src="js/ajax-form.js"></script>
    <script src="js/wow.min.js"></script>
    <script src="js/aos.js"></script>
    <script src="js/plugins.js"></script>
    <script src="js/main.js"></script>
</body>
  • 4
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值