Responsive Website
<html>
<head>
<title>Resort</title>
<style>
body
{
margin:0px;
}
ul.topnav
{
list-style-type:none;
margin:0px;
padding:0px;
overflow:hidden;
background-color:#6F0;
}
ul.topnav li
{
float:left;
}
ul.topnav li a
{
display:block;
color:#300;
text-align:center;
padding:14px 16px;
text-decoration:none;
}
ul.topnav li a:hover:not
(.active)
{background-color:#C09}
.a
{
height:auto;
width:100%;
padding:5px;
box-sizing:border-box;
background-image:url(a.jpg);
overflow:hidden;
padding:200px 250px;
background-size:100% 100%;
}
.a1
{
overflow:hidden;
font-size:48px;
color:#F00;
}
.gallery
{
height:400px;
width:100%;
background-color: #339;
font-size:36px;
padding-top:20px;
color:#FFF;
}
.gal1
{
height:auto;
width:30%;
float:left;
margin-left:20px;
}
.test
{
height:auto;
padding:50px 50px;
overflow:hidden;
background-color:#FF0;
}
.test1
{
height:100px;
overflow:hidden;
width:100px;
border-radius:50%;
margin-left:600px;
box-sizing:border-box;
background-image: url(redisson %20logo.gif);
background-size:100% 100%;
}
.logo
{
height:100px;
width:100%;
top:100px;
}
.address
{
height:auto;
width:50%;
background-color:#00F;
float:left;
padding:50px 50px;
box-sizing:border-box;
}
.form
{
height:auto;
width:50%;
background-color:#F00;
float:left;
box-sizing:border-box;
}
input[type=text]
{
height:50px;
width:70%;
background-color: #FFF;
font-size:18px;
color: #000;
border:none;
outline:none;
background:none;
border-bottom:5px solid #FFF;
margin-left:50px;
}
input[type=number]
{
height:50px;
width:70%;
background-color: #FFF;
font-size:18px;
color: #000;
border:none;
outline:none;
background:none;
border-bottom:5px solid #FFF;
margin-left:50px;
}
input[type=email]
{
height:50px;
width:70%;
background-color: #FFF;
font-size:18px;
color: #000;
border:none;
outline:none;
background:none;
border-bottom:5px solid #FFF;
margin-left:50px;
}
input[type=contact]
{
height:50px;
width:70%;
background-color: #FFF;
font-size:18px;
color: #000;
border:none;
outline:none;
background:none;
border-bottom:5px solid #FFF;
margin-left:50px;
}
input[type=email]
{
height:50px;
width:70%;
background-color: #FFF;
font-size:18px;
color: #000;
border:none;
outline:none;
background:none;
border-bottom:5px solid #FFF;
margin-left:50px;
}
input[type=Submit]
{
height:50px;
width: 30%;
background-color:#999;
font-size:18px;
color:#000;
border:none;
outline:none;
border-radius:25px;
margin-left:200px;
margin-top:7px;
}
@media screen and (max-width:600px)
{
ul.topnavli.right,
ul.topnav li {float: none;
}
.a
{
height:auto;
width:100%;
box-sizing:border-box;
background-image:url(a.jpg);
overflow:hidden;
padding:200px 10px;
background-size:100% 100%;
}
.a1
{
overflow:hidden;
font-size:48px;
color:#F00;
}
.gallery
{
height:1000px;
width:100%;
background-color: #339;
font-size:36px;
padding-top:20px;
color:#FFF;
}
.gal1
{
height:auto;
width:100%;
}
.gallery
{
height:1000px;
width:100%;
background-color: #339;
font-size:36px;
padding-top:20px;
color:#FFF;
box-sizing:border-box;
}
.test
{
overflow:hidden;
background-color:#FF0;
height:auto;
padding:50px 50px;
}
.test1
{
height:100px;
overflow:hidden;
width:100px;
border-radius:50%;
margin-left:200px;
box-sizing:border-box;
background-image: url(redisson%20logo.gif);
background-size:100% 100%;
}
.logo
{
height:100px;
width:100%;
top:100px;
}
.address
{
height:auto;
width:100%;
background-color:#00F;
float:left;
box-sizing:border-box;
}
.form
{
height:auto;
width:100%;
background-color:#F00;
float:left;
box-sizing:border-box;
}
input[type=text]
{
height:50px;
width:70%;
background-color: #FFF;
font-size:18px;
color: #000;
border:none;
outline:none;
background:none;
border-bottom:5px solid #FFF;
margin-left:50px;
}
input[type=number]
{
height:50px;
width:70%;
background-color: #FFF;
font-size:18px;
color: #000;
border:none;
outline:none;
background:none;
border-bottom:5px solid #FFF;
margin-left:50px;
}
input[type=email]
{
height:50px;
width:70%;
background-color: #FFF;
font-size:18px;
color: #000;
border:none;
outline:none;
background:none;
border-bottom:5px solid #FFF;
margin-left:50px;
}
input[type=contact]
{
height:50px;
width:70%;
background-color: #FFF;
font-size:18px;
color: #000;
border:none;
outline:none;
background:none;
border-bottom:5px solid #FFF;
margin-left:50px;
}
input[type=Submit]
{
height:50px;
width: 30%;
background-color:#999;
font-size:18px;
color:#000;
border:none;
outline:none;
border-radius:25px;
margin-left:200px;
margin-top:7px;
}
</style>
</head>
<body>
<ul class="topnav">
<li class="active"><a class="active" href="#home">Home</a></li>
<li><a href="#news">News</a></li>
<li><a href="#contact">Contact</a></li>
<li><a href="career">Career</a></li>
<li><a href="#service">Service</a></li>
</ul>
<div class="a">
<div class="a1"><center>Welcome to Resort</center></div>
</div>
<div class="gallery"><center>Gallery</center>
<div class="gal1"><imgsrc="Radisson.jpg" height="300px;"/></div>
<div class="gal1"><imgsrc="Radisson.jpg" height="300px;"/></div>
<div class="gal1"><imgsrc="Radisson.jpg" height="300px;"/></div>
</div>
<div class="test">
<div class="test1"></div>
<div class="logo"><center><font style="font-size:18px" color="#FF0000">A resort (North
American English) is a self-contained commercial establishment<BR /> that tries to provide most of a vacationer's wants, such as food, drink, lodging, sports,<br> entertainment, and shopping, on the premises.</font></center></div>
</div>
<div class="address"><font style="font-size:18px" color="white">1 DKN 74 C Vijay Nagar Indore, M.P.<br />
1 DKN 74 C Vijay Nagar Indore, M.P.<br />
1 DKN 74 C Vijay Nagar Indore, M.P.<br />
1 DKN 74 C Vijay Nagar Indore, M.P.<br/>
A resort (North American English) is a self-contained commercial establishment.A resort (North American English) is a self-contained commercial establishment.A resort (North American English) is a self-contained commercial establishment<BR /> that tries to provide most of a vacationer's wants, such as food, drink, lodging, sports,<br> entertainment, and shopping, on the premises<br/><br/><br/>
Contact 8871428895<br/><br/><br/>
Email: webtipstop@webmail.com.</font>
</div>
<div class="form">
<input type="text" placeholder="enter name"><br /><br /><br />
<input type="number" placeholder="enter number"><br /><br /><br />
<input type="email" placeholder="enter email"><br /><br /><br />
<input type="contact" placeholder="enter contact"><br/><br/><br/>
<input type="submit" name="submit" value="submit">
</div>
</body>
</html>
Nicely Explained The Topic "Designing Services" same as you mention about is quite popular these days in the united kingdom, United States, Ireland, And other countries. our company provides same services without any risk, kindly visit to know Website Designing Services
ReplyDeleteQuite informative post. Thanks for sharing...
ReplyDeletedubaiwebsitedesign