Please only design the framework and the code (with empty links). I can supply t
ID: 3592245 • Letter: P
Question
Please only design the framework and the code (with empty links). I can supply the pictures and text myself. Example of desired result:
Develop a personal web page. Minimum requirements that must be satisfied can be described as follows:
(a) At least four different sections (design your own web page)
(b) Your photo and descriptions about you
(c) At least 5 buttons linked to another resources
Name About Me Menu Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur at finibus sem. Mauris sapien ipsum, suscipit eget ante eu, tristique tempus tellus. Aliquam a leo vel augue interdum elementum at posuere odio. Mauris nunc leo, ultrices eu orci cursus, euismod sodales odio. Etiam at tincidunt urna, congue pellentesque ligula. Donec vel elementum ligula. Nunc quam nisi, mollis vitae tincidunt id fermentum sollicitudin nulla. Vivamus vitae fermentum purus, ut Home Assignment 1 Assignment 2 Google Scholar Google site Copyright (C) 2017 Name All Rights RescrvedExplanation / Answer
<!DOCTYPE html>
<html>
<head>
<title>Personal Web Page</title>
<style type="text/css">
*{
margin: 0;
padding: 0;
}
#All
{
width: 1024px;
height: 720px;
}
h1
{
position:absolute;
top: 4%;
left: 3%;
color: white;
font-family: sans-serif;
font-size: xx-large;
font-style: inherit;
}
#Head
{
width: 100%;
height: 14%;
background-color: #2a3a4f;
}
#Center
{
width: 100%;
height: 76%; }
#Left
{
width: 75%;
height: 100%;
float: left;
border-color: white;
border: 1px;
}
#Right
{
width: 25%;
height: 100%;
border-color: pink;
border: 1px;
float: right;
background-color: #cf7d52;
}
#Fotter
{
width: 100%;
height: 10%;
background-color: #2a3a4f;
}
#Pic
{
width: 100%;
height: 100%;
border: 1;
}
#Center_Content
{
width: 100%;
height: 100%;
}
#Center_Head
{
width: 100%;
height: 15%;
}
#Center_Left
{
width: 25%;
height: 85%;
float: left;
background-color: white;
}
#Center_Right
{
width: 75%;
height: 85%;
float: right;
}
#Center_Head_A
{
position: relative;
top: 35%;
left: 25%;
color: black;
font-size: x-large;
}
#Img
{
width: 90%;
height:auto;
border:1px solid;
align-self: center;
align-content:center;
}
pre
{
position: relative;
top:35%;
left: 5%;
align-content: center;
color: white;
font-family: sans-serif;
font-size: large;
font-style: inherit;
}
#P
{
align-content: center;
color:black;
font-family: sans-serif;
font-size: large;
font-style: inherit;
}
li
{
position:relative;
top: 2%;
list-style: none;
list-style-type: none;
width: 100%;
height: 100%;
float: none;
text-align: center;
font-size: x-large;
display:block;
float:left;
font-family:Constantia, "Lucida Bright", "DejaVu Serif", Georgia, serif;
font-size: 1.4vmax;
}
button
{
width: 80%;
height:5vmax;
margin: 0;
border-radius: 3%;
align-content: center;
align-items: center;
align-self: center;
color: white;
text-align: left;
padding: 3% 2% 3% 2%;
alignment-baseline: central;
background-color: #2a3a4f;
border: 0px solid white;
margin-left: 10px;
color: white;
cursor: pointer;
font-size:1.2vmax;
text-decoration:none;
}
ul
{
list-style: none;
float: none;
padding: 2% 2% 2% 2.5%;
}
li>a
{
width:100%;
height:100%;
display:block;
text-align:center;
text-decoration:none;
color: #FFFFFF;
}
@media screen and (max-width: 1280px)
{
#All
{
width:100%;
height:1024px;
}
}
@media screen and (max-width: 1366px)
{
#All
{
width:100%;
height:768px;
}
}
@media screen and (max-width: 1440px)
{
#All
{
width:100%;
height:900px;
}
}
@media screen and (max-width: 1920px)
{
#All
{
width:100%;
height:1080px;
}
}
@media screen and (max-width: 1280px)
{
#All
{
width:100%;
height:720px;
}
}
@media screen and (max-width: 1280px)
{
#All
{
width:100%;
height:800px;
}
}
</style>
</head>
<body>
<div id="All">
<div id="Head"><h1>Name</h1></div>
<div id="Center">
<div id="Left">
<div id="Center_Content">
<div id="Center_Head"><h1 id="Center_Head_A">About Me</h1></div>
<div id="Center_Left"><center><img id="Img" src="A.jpg" name="Pic" align="Center" ></center></div>
<div id="Center_Right"><p id="P">jdnsdnksdsdbsbjvzbvz<br>zvbjsbgvjssjsj<br>dkjsjsjgjssjgs<br>zvbjsbgvjssjsj<br>dkjsjsjgjssjgs<br>zvbjsbgvjssjsj<br>dkjsjsjgjssjgs</p></div>
</div>
</div>
<div id="Right">
<center><li><center>Menu</center>
<ul><a href=""><button>Home</button></a></ul>
<ul><a href=""><button>Assignmnet 1</button></a></ul>
<ul><a href=""><button>Assignmnet 2</button></a></ul>
<ul><a href=""><button>Google Scholer</button></a></ul>
<ul><a href=""><button>Google Site</button></a></ul>
</li>
</center>
</div>
</div>
<div id="Fotter"><pre>Copyright (C) 2017 Name -All Rights Reserved</pre></div>
</div>
</body>
</html>