<!--[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>
</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>
一、css是Cascading Style Sheets 的缩写,即层叠式样式表单，它是由W3C协会制定并发布的一个网页排版式标准,是对HTML语言功能的补充。
二、HTML和CSS的区别?
1、定义不同：
html是HyperTextMark-upLanguage的缩写，即超文本标记语言；
css是Cascading Style Sheets 的缩写,即层叠式样式表单，它是由W3C协会制定并发布的一个网页排版式标准,是对HTML语言功能的补充。
2、用途不同：
html则是用于文本内容，包括头部（Head）、主体（Body）两大部分，其中头部描述浏览器所需的信息，而主体则包含所要说明的具体内容。
css是多用于样式，主要的用途是对网页中字体、颜色、背景、图像及其他各种元素的控制,使网页能够完全按照设计者的要求来显示。
3、CSS语法与HTML语法完全不同：
HTML里代码是功能标签，如DIV、SPAN、A链接、em标签、I斜体标签、u下划线等，html代码语法范例：<div>内容</div>
CSS样式代码语法是div{样式单词：值}
三、HTML和CSS联系：
CSS与HTML相同之处在于，两个共同作用让网页实现需要的布局样式。
扩展资料：
1、标记符<html>,说明该文件是用超文本标记语言（本标签的中文全称）来描述的,它是文件的开头而</html>,则表示该文件的结尾，它们是超文本标记语言文件的开始标记和结尾标记。
2、CSS为HTML标记语言提供了一种样式描述，定义了其中元素的显示方式。CSS在Web设计领域是一个突破。利用它可以实现修改一个小的样式更新与之相关的所有页面元素。
CSS可以将样式定义在HTML元素的style属性中，也可以将其定义在HTML文档的header部分，也可以将样式声明在一个专门的CSS文件中，以供HTML页面引用。总之，CSS样式表可以将所有的样式声明统一存放，进行统一管理。
