<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<style type="text/css">
.box{
width: 1600px;
height: 3000px;
margin: 0 auto;
}
.box1{
width: 1200px;
height: 70px;
margin: 0 auto;
padding-bottom: 0px;
}
.box11{
float: left;
width: 60px;
height: 40px;
}
.box12{
float: left;
width: 100px;
height: 100px;
}
.box13{
padding-left: 300px;
padding-top: 20px;
float: left;
width: 700px;
height: 100px;
}
.box13 ul {
list-style: none;
margin: 0;
padding:0;
}
.box13 ul li a{
display: block;
width: 80px;
height: 20px;
font-size: 10px;
float: left;
}
.box2{
width: 1600px;
height: 250px;
background-image: url(img/inner-bg.jpg);
background-size: 110%;
background-position: center;
background-repeat: no-repeat;
}
.box3{
background-color: lavender;
margin:0;
width: 1600px;
height: 60px;
margin:0px;
}
.box4{
width: 1200px;
height: 200px;
margin: 0 auto;
}
.box5{
margin: 0 auto;
width: 1200px;
height: 400px;
}
.box51{
width: 500px;
height: 400px;
float: left;
padding-right: 50px;
}
.box6{
width: 1600px;
height:700px;
background-image: url(img/bg5.jpg);
margin: 0 auto;
background-size: cover;
}
.box61{
margin: 0 auto;
width: 1000px;
height: 1000px;
}
.box62{
width: 400px;
height: 200px;
float: left;
}
.box63{
width: 400px;
height: 200px;
float: right;
}
.box7{
width: 1600px;
height: 650px;
}
.box71{
float: left;
width: 300px;
padding-left: 50px;
padding-right: 50px;
margin: 0;
}
.box8{
width: 1600px;
height: 500px;
background-color: grey;
}
.box81{
padding-top: 50px;
width: 1000px;
height: 500px;
margin: 0 auto;
}
.box811{
width: 300px;
height: 500px;
padding-left: 15px;
padding-right: 15px;
float: left;
}
</style>
</head>
<body>
<div class="box">
<div class="box1">
<div class="box11">
<img src="img/b2.jpg" width="60px" height="40px" style="float: left;">
</div>
<div class="box12">
<p style="font-size: 10px;color: red;margin: 0;padding-left: 40px;" >Tasty</p>
<p style="font-size: 20px;color: black;margin: 0;" >Burger</p>
</div>
<div class="box13">
<ul>
<li><a>HOME</a></li>
<li><a>ABOUT US</a></li>
<li><a>
<select name="1">
<option value="1">PAGES</option>
</select>
</a></li>
<li><a>MENU</a></li>
<li><a>CONTRACT US</a></li>
</ul>
</div>
</div>
<div class="box2">
</div>
<div class="box3">
<p style="color: red; padding-top: 15px;font-size: 15px;padding-left: 10px;margin-top: 0px;">Home <span style="color:black">/ About Us</span></p>
</div>
<div class="box4">
<center><p style="color: black; padding-top: 80px;font-size: 40px;padding-left: 10px;margin-top: 0px;padding-bottom: 0px;margin-bottom: 0px;">About <span style="color:red"> Us</span></p></center>
<center><p style="color: gray; margin: 0px;padding-left: 270px;padding-right: 270px;">Inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.Nemo enim totam
rem aperiam.</p></center>
</div>
<div class="box5">
<div class="box51">
<p style="font-size: 25px;padding-right: 200px;">Donec conse sapien archi
ut cursus rhons.</p>
<p style="font-size: 17px;padding-right: 30px;color: gray;">Nullam dui mi, vulputate ac metus at, semper varius orci. Nulla
accumsan ac elit in congue. Class aptent taciti sociosqu ad litora
torquent per conubia</p>
<hr style="border-style: dashed;padding-right: 100px;"/>
<p style="font-size: 17px;padding-right: 30px;color: gray;">Donec consequat sapien ut leo cursus rhoncus. Nullam dui mi,
vulputate ac metus at, semper varius orci ..</p>
</div>
<div class="box51">
<img src="img/ab.jpg" style="width: 500px;" />
</div>
</div>
<div class="box6">
<div class="box61">
<center><p style="color: gray;padding-top: 30px;font size: 0.9375rem;padding-bottom: 0rem;margin: 0rem;">Our Work</p></center>
<center><p style="color:black;padding-top: 0px;font-size: 1.875rem;margin: 0rem;">Excellent <span style="color:red;">Services</span></p></center>
<br />
<br />
<div class="box62">
<img src="img/s1.png" style="width:90px;float: right;" />
<div style="width: 300px;height:200px;float: right;">
<p style="font-size:25px;float: right;padding-right: 40px;margin: 0;">Free Shipping</p>
<p style="font-size:15px;float: right;padding-right: 40px; margin: 0;color: gray;">Morbi viverra lacus commodo felis
semper lectus feugiat.</p>
</div>
<img src="img/s3.png" style="width:90px;float: right;padding-right: 3.125rem;" />
<div style="width: 250px;height:200px;float: right;">
<p style="font-size:25px;float: right;padding-right: 40px;margin: 0;">OrderOnline</p>
<p style="font-size:15px;float: right;padding-right: 40px; margin: 0;color: gray;">Morbi viverra lacus commodo felis
semper lectus feugiat.</p>
</div>
</div>
<div class="box63">
<img src="img/s2.png" style="width:90px;float: left;" />
<div style="width: 300px;height:200px;float: left;">
<p style="font-size:25px;float: left;padding-left: 40px;margin: 0;">Free & Easy Returns</p>
<p style="font-size:15px;float: left;padding-left: 40px; margin: 0;color: gray;">Morbi viverra lacus commodo felis
semper lectus feugiat.</p>
</div>
<img src="img/s4.png" style="width:90px;float: left;padding-left: 3.125rem;" />
<div style="width: 250px;height:200px;float: left;">
<p style="font-size:25px;float: left;padding-left: 40px;margin: 0;">24/7 Support</p>
<p style="font-size:15px;float: left;padding-left: 40px; margin: 0;color: gray;">Morbi viverra lacus commodo felis
semper lectus feugiat.</p>
</div>
</div>
<center><img src="img/img.png" alt="" /></center>
</div>
</div>
<div class="box4">
<center><p style="color: black; padding-top: 80px;font-size: 40px;padding-left: 10px;margin-top: 0px;padding-bottom: 0px;margin-bottom: 0px;">Our <span style="color:red"> Chefs</span></p></center>
<center><p style="color: gray; margin: 0px;padding-left: 270px;padding-right: 270px;">Inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.Nemo enim totam
rem aperiam.</p></center>
</div>
<div class="box7">
<div class="box71">
<img src="img/t1.png" alt="" />
<p style="font-size: 1.875rem;float: right;padding-right: 3.125rem;">Mack Joe</p>
<img src="img/lxfs.jpg" alt="" style="width: 100px;padding-left: 100px;margin: 0;padding-right: 3.125rem;float: right;"/>
</div>
<div class="box71">
<img src="img/t2.png" alt="" />
<p style="font-size: 1.875rem;float: right;padding-right: 3.125rem;">DeoCruz</p>
<img src="img/lxfs.jpg" alt="" style="width: 100px;padding-left: 100px;margin: 0;padding-right: 3.125rem;float: right;"/>
</div>
<div class="box71">
<img src="img/t3.png" alt="" />
<p style="font-size: 1.875rem;float: right;padding-right: 3.125rem;">Rochy Jae</p>
<img src="img/lxfs.jpg" alt="" style="width: 100px;padding-left: 100px;margin: 0;padding-right: 3.125rem;float: right;"/>
</div>
<div class="box71">
<img src="img/t4.png" alt="" />
<p style="font-size: 1.875rem;float: right;padding-right: 3.125rem;">Rojo</p>
<img src="img/lxfs.jpg" alt="" style="width: 100px;padding-left: 100px;margin: 0;padding-right: 3.125rem;float: right;"/>
</div>
</div>
<div class="box8">
<div class="box81">
<div class="box811">
<br />
<img src="img/b2.jpg" width="70px" style="float: left;"/>
<div class="box12">
<p style="font-size: 10px;color: red;margin: 0;padding-left: 90px;" >Tasty</p>
<p style="font-size: 20px;color:aliceblue;margin: 0;padding-left: 3.125rem;" >Burger</p>
</div>
<br />
<br /><br /><br />
<p>
Sed ut perspiciatis unde omnis iste natus errorhjhsit
lupt atem accursit lupt atem accu dfdsa
loremaue laudan tium aco
doloremque laudan tium accu santium dolore.
</p>
<br /><br />
<p style="font-size: 1.875rem;">Follow As:</p>
</div>
<div class="box811">
<p style="font-size: 1.875rem;color: aliceblue;">Contact Us</p>
<p>Address : 1234 lock, Charlotte, North Carolina,
United States</p>
<p>Phone : +12 534894364</p>
<p>Email: info@example.com</p>
<p style="font-size: 1.875rem;color: aliceblue;">Payment Method</p>
<img src="img/pay4.png" alt="" style="float: right;"/>
<img src="img/pay1.png" alt="" style="float: right;"/>
<img src="img/pay5.png" alt="" style="float: right;"/>
<img src="img/pay2.png" alt="" style="float: right;"/>
</div>
<div class="box811">
<p style="font-size: 1.875rem;color: aliceblue;">Request Info</p>
<input type="text" value="Name" style="width: 100px;background-color: gainsboro;float: left;">
<input type="text" value="Phone" style="width: 100px;background-color: gainsboro;float: left;">
<br /><br />
<input type="text" value="Email" style="width: 210px;height:30px;background-color: gainsboro;float: left;">
<br /><br /><br />
<input type="text" value="Comment" style="width: 210px;background-color: gainsboro;float: left;height: 3.75rem;">
<div style="padding-top: 100px;padding-left: 140px;"><button style="width: 4.375rem;height: 1.5625rem;border-radius: 10%;background-color: orangered;">Submit</button></div>
</div>
</div>
</div>
</div>
</body>
</html>
703
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
