Project - Contact Us Page HTML

<!
DOCTYPE html>
<html>
<head>
<title>html5/css3 for beginners to front end developers</title>
<meta charset="UTF-8" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<style>
body {
margin:0;
padding:0;
width:100%;
font-family: "sans-serif", arial, Verdana;
background-image:url("images/pattern.png");
.topline {
width:100%;
height:10px;
background:linear-gradient(red, #95201a);
margin:0;
}
.limg {
margin:0;
padding: 10px 0 0 150px;
float:left;
.logoname {
float:left;
padding-top:75px;
font-size:1.4em;
color:#bd1010;
font-weight:bold;
.search {
float:right;
padding:75px 150px 0 0;
.navbar {
width:1100px;
height:50px;
border:none;
margin:0;
margin-left:130px;
margin-right:auto;
float:left;
.navbar ul {
padding-left:10px;
.navbar li {
list-style:none;
float:left;
padding:0 50px 0 20px;
color:#777777;
font-size:1em;
margin-top:10px;
.navbarbline {
height:2px;
width:1100px;
border:none;
margin:0;
margin-left:130px;
margin-right:auto;
float:left;
background-color:#aa1f17;
.banner {
float:left;
margin-top:10px;
margin-left:130px;
box-shadow:1px 2px 1px #888888;
.contact {
width :1100px;
height:750px;
background-color:#ffe7e7;
float:left;
margin:0;
margin-top:20px;
margin-left:130px;
box-shadow:1px 1px 1px 1px #888888;
.communicate {
width:100%;
height:auto;
margin:0;
float:left;
margin-left:20px;
.contactImage {
width:20%;
height:auto;
margin:0;
float:left;
margin-top:25px;
.contactImage p {
color:#59c1e8;
.contactForm {
width:40%;
height:auto;
margin:0;
float:left;
margin-left:50px;
margin-top:25px;
}
.contactAddress {
width:25%;
height:250px;
background-color:#e9e7e7;
margin:0;
float:left;
margin-left:25px;
margin-top:25px;
padding:10px 0 0 10px;
border-top-left-radius:150px;
border-top-right-radius:150px;
border-bottom-left-radius:150px;
box-shadow:1px 1px 1px 1px #888888;
address {
margin-top:75px;
text-align:center;
.footer {
float:left;
margin:0;
width:100%;
height:30px;
background:linear-gradient(red, #95201a);
margin-top:25px;
.footer p {
color:white;
text-align:center;
margin:0;
font-size:1.2em;
</style>
</head>
<body>
<div class="container">
<div class="topmenu">
<div class="topline">
</div>
<div class="limg">
<img src="images/logo.png" alt="logo" height="100px"

width="100px">
</div>
<div class="logoname">
anumasun
</div>
<div class="search">
<form class="forngroup">
Search<input></input>
</form>
</div>
<div class="navbar">
<ul>
<li>Home</li>
<li>Web Development</li>
<li>Corporate</li>
<li>Ecommerce</li>
<li>News</li>
<li>Tourism & Travel</li>
<li><span style="color:red;">Contact Us</span></li>
</ul>
</div>
<div class="navbarbline">
</div>
</div>
<div class="banner">
<img src="images/banner.jpg" alt="banner" >
</div>
<div class="contact">
<div class="communicate">
<div class="contactHeader">
<h3>Contact Us for Technical Support - for all enquiries</h3>
</div>
<hr style="margin-right:50px;">
<div class="contactImage">
<img src="images/contact.jpg" alt="contactus" >
<p> Call us anytime!<br> We are here to assist</p>
<p><a href="mailto:sundar@anumassun.com">Email Us</a>

<br>
+918205578934
</p>
</div>
<div class="contactForm">
Name:<br>
<input type="text" name="Name" placeholder="name">
<br>
Email:
<br>
<input type="email" name="email" placeholder="your email">
<br>
Phone:<br>
<input type="text" name="Phone" placeholder="phone

number">
<br>
Subject:<br>
<input type="text" name="Subject" placeholder="Subject">
<br>
Comments:
<br>
<textarea name="message" rows="20" cols="50" >Write your

comments</textarea>
<br>
<input type="submit" value="submit">
<br>
<br>
Immediate Response Required:
<br>
<input type="radio" name="select" value="yes">Yes
<br>
<input type="radio" name="select" value="no">No
<br>
<br>
<input type="checkbox" name="option" value="HTML">HTML
<input type="checkbox" name="option" value="CSS">CSS
<input type="checkbox" name="option"

value="Webdeveloper">Web Developer
<br>
</div>
<div class="contactAddress">
<address>
<h4><u>Our Communication Office:</u></h4>
Office:207, Bldg-G11,<br>Media Campus,<br>Mount

Road,<br>Chennai, India
</address>
</div>
</div>
</div>
</div>
<div class="footer">
<p>&phone; / &commat; - We are here to help you.</p>
</div>
</body>
</html>

Project - Contact Us Page HTML

Hochgeladen von

Dokumentinformationen

Copyright

Verfügbare Formate

Dieses Dokument teilen

Dokument teilen oder einbetten

Freigabeoptionen

Stufen Sie dieses Dokument als nützlich ein?

Sind diese Inhalte unangemessen?

Copyright:

Verfügbare Formate

Project - Contact Us Page HTML

Hochgeladen von

Copyright:

Verfügbare Formate

<!

<title>html5/css3 for beginners to front end developers</title>

<meta charset="UTF-8" />

<meta http-equiv="content-type" content="text/html; charset=utf-8" />

<meta name="viewport" content="width=device-width, initial-scale=1" />

font-family: "sans-serif", arial, Verdana;

padding: 10px 0 0 150px;

padding:0 50px 0 20px;

box-shadow:1px 2px 1px #888888;

box-shadow:1px 1px 1px 1px #888888;

box-shadow:1px 1px 1px 1px #888888;

<img src="images/logo.png" alt="logo" height="100px"

<li>Tourism &amp; Travel</li>

<li><span style="color:red;">Contact Us</span></li>

<img src="images/banner.jpg" alt="banner" >

<h3>Contact Us for Technical Support - for all enquiries</h3>

<img src="images/contact.jpg" alt="contactus" >

<p> Call us anytime!<br> We are here to assist</p>

<p><a href="mailto:sundar@anumassun.com">Email Us</a>

<input type="text" name="Name" placeholder="name">

<input type="email" name="email" placeholder="your email">

<input type="text" name="Phone" placeholder="phone

<input type="text" name="Subject" placeholder="Subject">

<textarea name="message" rows="20" cols="50" >Write your

<input type="submit" value="submit">

Immediate Response Required:

<input type="radio" name="select" value="yes">Yes

<input type="checkbox" name="option" value="HTML">HTML

<input type="checkbox" name="option" value="CSS">CSS

<input type="checkbox" name="option"

<h4><u>Our Communication Office:</u></h4>

Office:207, Bldg-G11,<br>Media Campus,<br>Mount

<p>&phone; / &commat; - We are here to help you.</p>

Das könnte Ihnen auch gefallen

<li>Tourism & Travel</li>