<!--[if (gte IE 9)|!(IE)]><!--><html lang="en"><!--<![endif]-->
<head>
<!-- Basic Page Needs
================================================== -->
<meta charset="utf-8">
<title>zBabyCare</title>
<meta name="description" content="Free Responsive Html5 Css3 Templates ">
<!-- Mobile Specific Metas
================================================== -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<!-- CSS
================================================== -->
<link rel="stylesheet" href="css/zerogrid.css">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/lightbox.css">
<!-- Custom Fonts -->
<link href="font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="css/menu.css">
<script src="js/jquery1111.min.js" type="text/javascript"></script>
<script src="js/script.js"></script>
</head>
<body>
<div class="wrap-body">
<div class="header">
<div id='cssmenu' >
<ul>
<li><a href='index.html'><span>zBabyCare</span></a></li>
<li class=' has-sub'><a href='#'><span>Category</span></a>
<ul>
<li class='has-sub'><a href='#'><span>Item 1</span></a>
<ul>
<li><a href='#'><span>Sub Item</span></a></li>
<li class='last'><a href='#'><span>Sub Item</span></a></li>
</ul>
</li>
<li class='has-sub'><a href='#'><span>Item 2</span></a>
<ul>
<li><a href='#'><span>Sub Item</span></a></li>
<li class='last'><a href='#'><span>Sub Item</span></a></li>
</ul>
</li>
</ul>
</li>
<li><a href='gallery.html'><span>Gallery</span></a></li>
<li><a href='single.html'><span>About</span></a></li>
<li class='last active'><a href='contact.html'><span>Contact</span></a></li>
</ul>
</div>
</div>
<!--Container-->
<section id="container">
<div class="wrap-container">
<div class="zerogrid">
<div class="row">
<h1 class="color-red" style="margin: 20px 0">Contact</h1>
<div class="col-full">
</div>
<div class="col-1-3">
<div class="wrap-col">
<h3 class="color-blue" style="margin: 20px 0">Contact Info</h3>
<span>SED UT PERSPICIATIS UNDE OMNIS ISTE NATUS ERROR SIT VOLUPTATEM ACCUSANTIUM DOLOREMQUE LAUDANTIUM, TOTAM REM APERIAM.</span>
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque la udantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia.</p>
<p>JL.Kemacetan timur no.23. block.Q3<br>
Jakarta-Indonesia</p>
<p>+6221 888 888 90 <br>
+6221 888 88891</p>
<p>info@yourdomain.com</p>
</div>
</div>
<div class="col-2-3">
<div class="wrap-col">
<div class="contact">
<h3 class="color-green" style="margin: 20px 0 20px 30px">Contact Form</h3>
<div id="contact_form">
<form name="form1" id="ff" method="post" action="contact.php">
<label class="row">
<div class="col-1-2">
<div class="wrap-col">
<input type="text" name="name" id="name" placeholder="Enter name" required="required" />
</div>
</div>
<div class="col-1-2">
<div class="wrap-col">
<input type="email" name="email" id="email" placeholder="Enter email" required="required" />
</div>
</div>
</label>
<label class="row">
<div class="col-2-4">
<div class="wrap-col">
<input type="text" name="subject" id="subject" placeholder="Subject" required="required" />
</div>
</div>
<div class="col-1-4">
<div class="wrap-col">
<input type="date" name="date" id="date" placeholder="Date"/>
</div>
</div>
<div class="col-1-4">
<div class="wrap-col">
<input type="time" name="time" id="time" placeholder="Time"/>
</div>
</div>
</label>
<label class="row">
<div class="wrap-col">
<textarea name="message" id="message" class="form-control" rows="4" cols="25" required
placeholder="Message"></textarea>
</div>
</label>
<center><input class="sendButton" type="submit" name="Submit" value="Submit"></center>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<hr class="line">
<!--/Footer-->
<footer>
<div class="wrap-footer">
<div class="zerogrid">
<div class="row">
<div class="col-1-3">
<div class="wrap-col">
<p>Copyright ©2019.Company name All rights reserved.<a target="_blank" href="http://www.programb.com/">网页模板</a></p>
</div>
</div>
<div class="col-1-3">
<div class="wrap-col">
<ul class="social-buttons">
<li><a href="#"><i class="fa fa-twitter"></i></a>
</li>
<li><a href="#"><i class="fa fa-facebook"></i></a>
</li>
<li><a href="#"><i class="fa fa-linkedin"></i></a>
</li>
</ul>
</div>
</div>
<div class="col-1-3">
<div class="wrap-col">
<ul class="quick-link">
<li><a href="#">Privacy Policy</a></li>
<li><a href="#">Terms of Use</a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</footer>
</div>
</body>
</html>
是导航之间的间距吗（希望能描述清楚些）？导航之间的间距的话大致如下
<style type="text/css">
div ul li{ margin-right:20px}
</style>
<div>
<ul>
<li><a href="#">首页</a></li>
<li><a href="#">首页</a></li>
<li><a href="#">首页</a></li>
</ul>
</div>
