You are on page 1of 6

<!

DOCTYPE html>
<html>
<head>
<title> Delicious Desserts</title>
</head>
<style>
body {
background-image: url("https://i.gyazo.com/
0aaf87edcad9ba17af5eed1e8c8ceb7a.gif");
}
p {
font-family = "Georgia";
font-size: 25px;
margin: 5px;
}
#navigation {
position: absolute;
margin-left: 40.5%;
margin-top: 0%;
}
a.nav, select{
display: inline;
background-color: orange;
padding: 10px;
text-align: center;
color: white;
text-decoration: none;
font-size: 20px;
}
a.nav {
border: 2px solid orange;
}
#dessertOfTheMonth {
margin-top: 70px;

width: 50%;
height: 560px;
border: 5px double magenta;
overflow: auto;
background-color: pink;
}
a.nav:hover {
background-color: red;
border: 2px solid red;
}
#header {
position: relative;
float: left;
width: 100%;
background-color: #00FFFF;
font-family: "Georgia";
}
h3 {
font-size: 25px;
}
#description {
position: relative;
width: 100%;
float: left;
margin-top: 0%;
}
#p2 {
font-size: 20px;
background-color: #80FFFF;
padding-left: 1%;
padding-right: 0.5%;
margin: 0%;
font-family: "Georgia";
}
select {

border: none;
font-family: "Times New Roman";
font-size: 20px;
}
#cupcakes {
margin-left: 13.5%;
margin-top: 23%;
position: absolute;
width: 345px;
height: 273px;
}
#soloCupcake {
position: absolute;
height: 273px;
margin-top: 23%;
margin-left: 34.5%;
}
#soloCupcake2 {
position: absolute;
height: 273px;
margin-top: 23%;
float: left;
}
#box {
position: absolute;
width: 48%;
height: 280px;
margin-top: 70px;
border: 3px solid #009999;
overflow: auto;
}
#iceCream {
text-decoration: none;
color: magenta;
}

#footer {
background-color: #FF0066;
width: 100%;
height: 15px;
margin-top: 43.5%;
}
</style>
<body>
<center><h1 style = "color: white; backgroundcolor: #FF0066">Delicious Desserts</h1></center>
<div id = "navigation">
<a class = "nav" href = "C:\Users\abharathala
\Documents\Users\Aparna\12th Grade\TGR\Aparna
\dessertsTest.html"> Home </a>
<a class = "nav" href = "http://
www.google.com"> Classics </a>
<select>
<a class = "nav" href = "http://
www.google.com"><option>Continents</option></a>
<a class = "nav" href = "http://
www.google.com"><option>North America</option></a>
<a class = "nav" href = "http://
www.google.com"><option>South America</option></a>
<a class = "nav" href = "http://
www.google.com"><option>Asia</option></a>
<a class = "nav" href = "http://
www.google.com"><option>Europe</option></a>
<a class = "nav" href = "http://
www.google.com"><option>Africa</option></a>
<a class = "nav" href = "http://
www.google.com"><option>Australia</option></a>
<a class = "nav" href = "http://
www.google.com"><option>Antarctica</option></a>
</select>
</div>
<div id = "box">
<div id = "header">

<center><h3> About This Website </h3></center>


</div>
<div id = "description">
<p id = "p2"> <text style ="margin-left:
30px">Lorem ipsum dolor sit amet,</text> consectetur
adipiscing elit. Integer vitae leo nulla. Cras
ullamcorper leo tortor, eget consequat lorem venenatis
non. Nunc malesuada blandit neque. Nulla eget magna
luctus, scelerisque lectus quis, venenatis enim.
Quisque sit amet magna non ipsum pharetra pretium.
Vestibulum egestas erat faucibus lorem tincidunt, nec
scelerisque est tempor. Praesent scelerisque enim at
ultrices dapibus. Nullam turpis nunc, consectetur sed
enim ut, porta bibendum nunc. Etiam purus sapien,
pellentesque sed magna a, interdum ultrices velit.
Maecenas eget eleifend nulla, vel dapibus lorem.
Suspendisse potenti. Aliquam in leo leo. Duis feugiat
risus eget lectus porta, et bibendum arcu aliquam.
Nulla vel tellus eros. Aenean lorem arcu, gravida vel
sem vel, varius blandit nisi. Duis ultricies semper
justo ut mattis. Quisque facilisis vel nulla volutpat
finibus. Aliquam feugiat dictum risus, et tristique
lacus commodo in. Mauris vehicula euismod ex ut
laoreet. Duis varius et mauris in maximus. Duis
vulputate purus quam, in fermentum massa rutrum in.
Proin scelerisque volutpat magna quis porttitor. Aenean
vitae ultricies diam.
</p>
</div>
</div>
<img id = "soloCupcake2"src ="https://
www.trophycupcakes.com/sites/default/files/styles/
standard_cupcake_detail/public/cupcakes/cupcake-redvelvet.jpg?itok=j3gpboNs">
<img id = "cupcakes" src = "https://i.gyazo.com/
eb8d425d6fd407d9a992a56c5114d156.gif">
<img id = "soloCupcake" src ="https://
tinycupcakesstore.files.wordpress.com/2015/03/
cupcakes.jpg">

<div id = "dessertOfTheMonth"; style = "float:


right">
<center><i><h2 style = "font-size: 30px">Ice
cream - Dessert of the Month</h2></i></center>
<center><img src = "https://i.gyazo.com/
87368a3399c90ee1d358273ef269eda9.gif" width = "400px"
height = "300px" border = "5px double black"></
center><br>
<p><text style = "padding-left: 40px"> Ice
cream is the most popular dessert in America. It comes
in many delicious </text> flavors. Today, we are going
to teach you the <a id = "iceCream" href = "http://
m.allrecipes.com/recipe/8314/vanilla-ice-cream/?
mxt=t06rda" target = "_blank">recipe</a>
for vanilla ice cream, the original flavor. </
p>
</div>
<div id = "footer"></div>
</body>
</html>

You might also like