<!DOCTYPE html>
<html lang="en">
<head>
<!--
Metro City Template
http://www.templatemo.com/tm-470-metro-city
-->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Metro City - Contact</title>
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300,400italic,600,700' rel='stylesheet' type='text/css'>
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/font-awesome.min.css" rel="stylesheet">
<link href="css/templatemo-style.css" rel="stylesheet">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body class="contact">
<div class="container">
<div class="row">
<div class="tm-header">
<a href="index.html" class="tm-site-name">Metro City</a>
<div class="mobile-menu-icon">
<i class="fa fa-bars"></i>
</div>
<nav class="tm-nav">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="about.html">About</a></li>
<li><a href="features.html">Features</a></li>
<li><a href="contact.html" class="active">Contact</a></li>
</ul>
</nav>
</div>
</div>
</div>
<div class="tm-banner tm-bn-4">
<div class="container">
<div class="row">
<div class="tm-banner-text">
<div class="tm-banner-text-inner">
<h1 class="tm-banner-title">Creative Design Agency</h1>
<p class="tm-banner-description">Lorem Ipsum Proin Gravida</p>
</div>
</div>
</div>
</div>
</div>
<div class="container">
<div class="row">
<div class="tm-contact-lr">
<div class="tm-map-container">
<div id="google-map"></div>
</div>
<div class="tm-2-columns">
<div class="col-lg-push-6 col-md-push-6 col-sm-push-6 col-xs-push-6 tm-contact-small-box tm-about-container tm-position-relative tm-white-box">
<h2 class="tm-h2 tm-about-title">Follow Us On <span class="tm-red-text margin-top-15">Social Networks</span></h2>
</div>
<div class="col-lg-pull-6 col-md-pull-6 col-sm-pull-6 col-xs-pull-6 tm-contact-small-box tm-red-box">
<i class="fa fa-4x fa-caret-left tm-triangle-left"></i>
<div class="tm-contact-social-icons">
<a href="#" class="tm-contact-social-icon"><i class="fa fa-twitter"></i></a>
<a href="#" class="tm-contact-social-icon"><i class="fa fa-rss"></i></a>
<a href="#" class="tm-contact-social-icon"><i class="fa fa-facebook"></i></a>
<a href="#" class="tm-contact-social-icon"><i class="fa fa-google-plus"></i></a>
</div>
</div>
</div>
</div>
<div class="tm-contact-lr">
<div class="tm-2-columns">
<div class="tm-contact-small-box tm-about-container tm-position-relative tm-white-box">
<h2 class="tm-h2 margin-bottom-0"><i class="fa fa-map-marker"></i> Our <span class="tm-blue-text">Address</span></h2>
</div>
<div class="tm-contact-small-box">
<i class="fa fa-4x fa-caret-right tm-triangle-right"></i>
<p class="tm-address">123, Rama IX Road,<br>Bangkok 12345,<br>Thailand.</p>
<img src="img/contact.jpg" alt="image" class="tm-contact-address-img">
</div>
</div>
<div class="tm-contact-form-container">
<form action="#" method="post" class="tm-contact-form">
<h2 class="tm-h2 tm-white-text">Contact <span class="tm-blue-text">Form</span></h2>
<div class="form-group margin-top-30">
<input type="text" id="contact_name" class="form-control" placeholder="NAME" />
</div>
<div class="form-group">
<input type="email" id="contact_email" class="form-control" placeholder="EMAIL" />
</div>
<div class="form-group">
<input type="text" id="contact_subject" class="form-control" placeholder="SUBJECT" />
</div>
<div class="form-group">
<textarea id="contact_message" class="form-control" rows="6" placeholder="MESSAGE"></textarea>
</div>
<div class="form-group">
<button class="tm-blue-button tm-form-submit-button" type="submit" name="submit">Send</button>
</div>
</form>
</div>
</div>
</div>
<div class="row">
<div class="tm-block-2-container">
<div class="tm-block-2 tm-block-order-2">
<div class="tm-footer-block tm-blue-box tm-footer-text-container">
<h3 class="tm-footer-text-title">Design With Happiness</h3>
<p class="tm-footer-text-description">Lorem Ipsum Proin Gravida</p>
</div>
</div>
<div class="tm-block-2 tm-block-order-1">
<p class="tm-footer-block tm-copyright-text">
Copyright © 2084 Metro City
| Design: <a rel="nofollow" href="http://www.templatemo.com/tm-470-metro-city" target="_parent">Metro City</a>
</p>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="js/jquery-1.11.2.min.js"></script> <!-- jQuery -->
<script type="text/javascript" src="js/templatemo-script.js"></script> <!-- Templatemo Script -->
<script>
/* Google map
------------------------------------------------*/
var map = '';
var center;
function initialize() {
var mapOptions = {
zoom: 16,
center: new google.maps.LatLng(13.758468,100.567481),
scrollwheel: false,
draggable:false
};
map = new google.maps.Map(document.getElementById('google-map'), mapOptions);
google.maps.event.addDomListener(map, 'idle', function() {
calculateCenter();
});
google.maps.event.addDomListener(window, 'resize', function() {
map.setCenter(center);
});
}
function calculateCenter() {
center = map.getCenter();
}
function loadGoogleMap(){
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&' + 'callback=initialize';
document.body.appendChild(script);
}
$(document).ready(function(){
loadGoogleMap();
});
</script>
</body>
</html>
作品展示&图片展示HTML源码-城市展示网站-响应式网页模板-适配移动端.zip
版权申诉
29 浏览量
2024-03-26
09:50:11
上传
评论
收藏 2.76MB ZIP 举报
作品展示&图片展示HTML源码-城市展示网站-响应式网页模板-适配移动端.zip （33个子文件） 
作品展示&图片展示HTML源码-城市展示网站-响应式网页模板-适配移动端 html js 
jquery-1.11.2.min.js 94KB templatemo-script.js 407B
features.html 6KB img 
about-1.jpg 285KB about-2.jpg 132KB banner-2.jpg 155KB banner-1.jpg 342KB banner-4.jpg 249KB home-2.jpg 243KB features-3.jpg 42KB home-1.jpg 39KB about-3.jpg 96KB features-1.jpg 135KB features-4.jpg 48KB home-3.jpg 113KB banner-3.jpg 210KB about-4.jpg 45KB home-4.jpg 85KB home-5.jpg 60KB features-2.jpg 114KB contact.jpg 11KB css bootstrap.min.css 47KB font-awesome.min.css 23KB templatemo-style.css 19KB index.html 7KB contact.html 7KB about.html 6KB fonts FontAwesome.otf 92KB fontawesome-webfont.eot 59KB fontawesome-webfont.woff 70KB fontawesome-webfont.woff2 55KB
fontawesome-webfont.svg 306KB fontawesome-webfont.ttf 119KB资源评论
DTcode7
- 粉丝: 4661
- 资源: 4100
