<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Insertion - About Page</title>
<!--
Template 2101 Insertion
http://www.tooplate.com/view/2101-insertion
-->
<!-- load CSS -->
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans:300,400"> <!-- Google web font "Open Sans" -->
<link rel="stylesheet" href="css/bootstrap.min.css"> <!-- https://getbootstrap.com/ -->
<link rel="stylesheet" href="css/fontawesome-all.min.css"> <!-- Font awesome -->
<link rel="stylesheet" href="css/tooplate-style.css"> <!-- Templatemo style -->
<script>
var renderPage = true;
if (navigator.userAgent.indexOf('MSIE') !== -1
|| navigator.appVersion.indexOf('Trident/') > 0) {
/* Microsoft Internet Explorer detected in. */
alert("Please view this in a modern browser such as Chrome or Microsoft Edge.");
renderPage = false;
}
</script>
</head>
<body>
<!-- Loader -->
<div id="loader-wrapper">
<div id="loader"></div>
<div class="loader-section section-left"></div>
<div class="loader-section section-right"></div>
</div>
<div class="tm-main">
<div class="tm-welcome-section">
<div class="container tm-navbar-container">
<div class="row">
<div class="col-xl-12">
<nav class="navbar navbar-expand-sm">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a href="index.html" class="nav-link tm-nav-link tm-text-white">Home</a>
</li>
<li class="nav-item active">
<a href="about.html" class="nav-link tm-nav-link tm-text-white active">About</a>
</li>
<li class="nav-item">
<a href="contact.html" class="nav-link tm-nav-link tm-text-white">Contact</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
<div class="container text-center tm-welcome-container">
<div class="tm-welcome">
<i class="fas tm-fa-big fa-music tm-fa-mb-big"></i>
<h1 class="text-uppercase mb-3 tm-site-name">Insertion</h1>
<p class="tm-site-description">New HTML Website Template</p>
</div>
</div>
</div>
<div class="container">
<div class="tm-search-form-container">
<form action="index.html" method="GET" class="form-inline tm-search-form">
<div class="text-uppercase tm-new-release">New Release</div>
<div class="form-group tm-search-box">
<input type="text" name="keyword" class="form-control tm-search-input" placeholder="Type your keyword ...">
<input type="submit" value="Search" class="form-control tm-search-submit">
</div>
<div class="form-group tm-advanced-box">
<a href="#" class="tm-text-white">Go Advanced ...</a>
</div>
</form>
</div>
<div class="row tm-about-row tm-mt-big tm-mb-medium">
<div class="col-xl-6 col-lg-6 col-md-12 col-sm-12 tm-about-col-left">
<div class="tm-v-center tm-bg-gray h-100 tm-about-text">
<h2 class="tm-text-brown mb-4 tm-about-h2">Lorem ipsum dolor sit amet</h2>
<p class="tm-about-description mb-0">Donec eu placerat sapien. Ut volutpat metus ipsum, a porttitor est consectetur quis. Pellentesque sit amet tristique odio, sed vulputate purus. Aliquam mattis suscipit orci, nec vehicula orci gravida sit amet. Morbi vel tortor et mauris sodales pretium.</p>
</div>
</div>
<div class="col-xl-6 col-lg-6 col-md-12 col-sm-12">
<div class="tm-about-img"></div>
</div>
</div>
<div class="row tm-about-row tm-mb-medium">
<div class="tm-tab-links-container">
<ul class="nav nav-tabs" id="tmTab" role="tablist">
<li class="nav-item">
<a class="nav-link tm-bg-gray tm-media-v-center tm-tab-link active" id="home-tab" data-toggle="tab" href="#tab1" role="tab" aria-controls="home" aria-selected="true">
<i class="fas fa-2x fa-music pr-4"></i>
<p class="media-body mb-0 tm-media-link">Proin vitae ligula</p>
</a>
</li>
<li class="nav-item">
<a class="nav-link tm-bg-gray tm-media-v-center tm-tab-link" id="profile-tab" data-toggle="tab" href="#tab2" role="tab" aria-controls="profile" aria-selected="false">
<i class="fab fa-2x fa-accusoft pr-4"></i>
<p class="media-body mb-0 tm-media-link">Nunc nec luctus</p>
</a>
</li>
<li class="nav-item">
<a class="nav-link tm-bg-gray tm-media-v-center tm-tab-link" id="contact-tab" data-toggle="tab" href="#tab3" role="tab" aria-controls="contact" aria-selected="false">
<i class="fab fa-2x fa-amazon-pay pr-4"></i>
<p class="media-body mb-0 tm-media-link">Etiam vel ligula</p>
</a>
</li>
<li class="nav-item">
<a class="nav-link tm-bg-gray tm-media-v-center tm-tab-link" id="contact-tab" data-toggle="tab" href="#tab4" role="tab" aria-controls="contact" aria-selected="false">
<i class="fas fa-2x fa-headphones pr-4"></i>
<p class="media-body mb-0 tm-media-link">Sed id magna</p>
</a>
</li>
</ul>
</div>
<div class="tm-tab-content-container">
<div class="tab-content h-100 tm-bg-gray" id="myTabContent">
<div class="tab-pane fade show active" id="tab1" role="tabpanel" aria-labelledby="tab1-tab">
<div class="media tm-media-2">
<i class="fas fa-5x fa-music mb-3 tm-text-pink-dark tm-media-2-icon"></i>
<div class="media-body tm-media-body-2">
<h2 class="mb-4 tm-text-pink-dark tm-media-2-header">Quisque pharetra tellus eu mi aliquet</h2>
<p class="mb-4">Phasellus efficitur, ante et bibendum accumsan, nisi tellus fermentum eros, eget tincidunt enim orci at arcu. Etiam vel ligula non neque pharetra scelerisque mollis ac arcu.</p>
<p class="mb-4">In luctus eu turpis sed sodales. Suspendisse nisi ante, dapibus id purus at, tristique ullamcorper dolor. Nullam tempus quam id odio tempus bibendum. Nullam vulputate, justo fermentum interdum fermentum, diam elit iaculis lorem, sed puvina.</p>
<a href="#" class="btn btn-secondary">Read More</a>
</div>
</div>
</div>
<div class="tab-pane fade" id="tab2" role="tabpanel" aria-labelledby="tab2-tab">
<div class="media tm-media-2">
<i class="fab fa-5x fa-accusoft mb-3 tm-text-pink-dark tm-media-2-icon"></i>
<div class="media-body tm-media-body-2">
<h2 class="mb-4 tm-text-pink-dark tm-media-2-header">Nunc nec luctus eu mi aliquet</h2>
<p class="mb-4">Phasellus efficitur, ante et bibendum accumsan, nisi tellus fermentum eros, eget tincidunt enim orci at arcu. Etiam vel ligula non neque pharetra scelerisque mollis ac arcu.</p>
<p class="mb-4">In luctus eu turpis sed sodales. Suspendisse nisi ante, dapibus id purus at, tristique ullamcorper dolor. Nullam tempus quam id odio tempus bibendum. Nullam vulputate, justo fermentum interdum fermentum, diam elit iaculis lorem, sed puvina.</p>
<a href="#" class="btn btn-secondary">Read More</a>
</div>
</div>
</div>
游戏音乐娱乐类网站源码-音乐主题响应式网页模板-支持移动端.zip （37个子文件） 
游戏音乐娱乐类网站源码-音乐主题响应式网页模板-支持移动端 html js 
bootstrap.min.js 49KB jquery-3.2.1.slim.min.js 68KB webfonts fa-brands-400.woff 62KB fa-brands-400.ttf 96KB
fa-brands-400.svg 496KB fa-solid-900.woff 49KB fa-solid-900.eot 104KB fa-solid-900.ttf 103KB fa-brands-400.woff2 53KB fa-regular-400.woff2 12KB fa-brands-400.eot 96KB fa-regular-400.eot 30KB fa-regular-400.woff 14KB fa-regular-400.svg 105KB fa-regular-400.ttf 30KB fa-solid-900.woff2 39KB fa-solid-900.svg 382KB img 
insertion-560x336-01.jpg 41KB insertion-140x140-01.jpg 13KB insertion-260x390-04.jpg 15KB insertion-140x140-02.jpg 10KB insertion-140x140-05.jpg 7KB insertion-260x390-01.jpg 29KB insertion-140x140-03.jpg 9KB insertion-260x390-03.jpg 20KB insertion-600x400.jpg 69KB insertion-header.jpg 64KB
gradient-blue.png 726B insertion-260x390-02.jpg 21KB insertion-140x140-04.jpg 6KB insertion-1800x450.jpg 54KB css bootstrap.min.css 137KB fontawesome-all.min.css 35KB tooplate-style.css 20KB
index.html 12KB contact.html 9KB about.html 13KB资源评论
