<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Astro Motion by TemplateMo</title>
<link href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@300;400&display=swap" rel="stylesheet">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/slick.css" type="text/css" />
<link rel="stylesheet" href="css/templatemo-style.css">
<!--
TemplateMo 560 Astro Motion
https://templatemo.com/tm-560-astro-motion
-->
</head>
<body>
<video autoplay muted loop id="bg-video">
<source src="video/gfp-astro-timelapse.mp4" type="video/mp4">
</video>
<div class="page-container">
<div class="container-fluid">
<div class="row">
<div class="col-xs-12">
<div class="cd-slider-nav">
<nav class="navbar navbar-expand-lg" id="tm-nav">
<a class="navbar-brand" href="#">Astro Motion</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbar-supported-content" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbar-supported-content">
<ul class="navbar-nav mb-2 mb-lg-0">
<li class="nav-item selected">
<a class="nav-link" aria-current="page" href="#0" data-no="1">Home</a>
<div class="circle"></div>
</li>
<li class="nav-item">
<a class="nav-link" href="#0" data-no="2">Gallery</a>
<div class="circle"></div>
</li>
<li class="nav-item">
<a class="nav-link" href="#0" data-no="3">About</a>
<div class="circle"></div>
</li>
<li class="nav-item">
<a class="nav-link" href="#0" data-no="4">Contact</a>
<div class="circle"></div>
</li>
</ul>
</div>
</nav>
</div>
</div>
</div>
</div>
<div class="container-fluid tm-content-container">
<ul class="cd-hero-slider mb-0 py-5">
<li class="px-3" data-page-no="1">
<div class="page-width-1 page-left">
<div class="d-flex position-relative tm-border-top tm-border-bottom intro-container">
<div class="intro-left tm-bg-dark">
<h2 class="mb-4">Welcome to Astro Motion</h2>
<p class="mb-4">
This HTML template has a motion video background loop which is provided by <a rel="sponsored" href="https://getfreepictures.com" target="_blank">Get Free Pictures</a>. This is
one-page responsive layout for your websites. Feel
free to use this for a commercial purpose. </p>
<p class="mb-0">
You are not permitted to redistribute this template on your Free CSS collection websites. Please <a rel="nofollow" href="https://templatemo.com/contact" target="_blank">contact us</a> for more information. </p>
</div>
<div class="intro-right">
<img src="img/home-img-1.jpg" alt="Image" class="img-fluid intro-img-1">
<img src="img/home-img-2.jpg" alt="Image" class="img-fluid intro-img-2">
</div>
<div class="circle intro-circle-1"></div>
<div class="circle intro-circle-2"></div>
<div class="circle intro-circle-3"></div>
<div class="circle intro-circle-4"></div>
</div>
<div class="text-center">
<a href="#0" data-page-no="2" class="btn btn-primary tm-intro-btn tm-page-link">
View Gallery
</a>
</div>
</div>
</li>
<li data-page-no="2">
<!-- Image Carousel -->
<div class="mx-auto position-relative gallery-container">
<div class="circle intro-circle-1"></div>
<div class="circle intro-circle-2"></div>
<div class="mx-auto tm-border-top gallery-slider">
<figure class="effect-julia item">
<img src="img/gallery-img-01.jpg" alt="Image">
<figcaption>
<div>
<p>Julia dances in the deep dark</p>
</div>
<a href="#">View more</a>
</figcaption>
</figure>
<figure class="effect-julia item">
<img src="img/gallery-img-02.jpg" alt="Image">
<figcaption>
<div>
<p>Julia dances in the deep dark</p>
</div>
<a href="#">View more</a>
</figcaption>
</figure>
<figure class="effect-julia item">
<img src="img/gallery-img-03.jpg" alt="Image">
<figcaption>
<div>
<p>Julia dances in the deep dark</p>
</div>
<a href="#">View more</a>
</figcaption>
</figure>
<figure class="effect-julia item">
<img src="img/gallery-img-04.jpg" alt="Image">
<figcaption>
<div>
<p>Julia dances in the deep dark</p>
</div>
<a href="#">View more</a>
</figcaption>
</figure>
<figure class="effect-julia item">
<img src="img/gallery-img-05.jpg" alt="Image">
<figcaption>
<div>
<p>Julia dances in the deep dark</p>
</div>
<a href="#">View more</a>
</figcaption>
</figure>
<figure class="effect-julia item">
<img src="img/gallery-img-06.jpg" alt="Image">
<figcaption>
<div>
<p>Julia dances in the deep dark</p>
</div>
<a href="#">View more</a>
</figcaption>
</figure>
<figure class="effect-julia item">
<img src="img/gallery-img-07.jpg" alt="Image">
<figcaption>
<div>
<p>Julia dances in the deep dark</p>
</div>
<a href="#">View more</a>
</figcaption>
</figure>
<figure class="effect-julia item">
<img src="img/gallery-img-08.jpg" alt="Image">
<figcaption>
<div>
<p>Julia dances in the deep dark</p>
</div>
<a href="#">View more</a>
</figcaption>
</figure>
<figure class="effect-julia item">
天体运动科普响应式网页模板-适配移动端设备-HTML网页源码.zip
版权申诉
184 浏览量
2024-04-02
09:32:05
上传
评论
收藏 9.32MB ZIP 举报
天体运动科普响应式网页模板-适配移动端设备-HTML网页源码.zip （21个子文件） 
天体运动科普响应式网页模板-适配移动端设备-HTML网页源码 html js 
bootstrap.min.js 60KB templatemo-script.js 2KB slick.js 86KB jquery-3.5.1.min.js 87KB img 
gallery-img-08.jpg 24KB gallery-img-02.jpg 23KB gallery-img-06.jpg 22KB home-img-1.jpg 12KB gallery-img-05.jpg 18KB tm-astro-bg.jpg 249KB gallery-img-04.jpg 46KB gallery-img-01.jpg 29KB gallery-img-09.jpg 12KB gallery-img-03.jpg 19KB gallery-img-07.jpg 21KB home-img-2.jpg 8KB css bootstrap.min.css 150KB slick.css 4KB templatemo-style.css 13KB
index.html 13KB video 
gfp-astro-timelapse.mp4 9MB资源评论
