Here are some examples of my work.
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>My Resume</title> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous"> <link href="style.css" rel="stylesheet" type="text/css" /> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@500&display=swap" rel="stylesheet"> </head> <body id="res"> <nav id="navigation">> <a href="index.html">Home</a> <a href="Resume.html">Reload</a> <a href="Projects.html">Projects</a> <a href="References.html">References</a> <a href="Certifications.html">Certifications</a> <a href="Examples.html">Examples</a> < </nav> <h1 >Hi, My name is Mezziah Im a Web/Game Developer.</h1> <p >I'm Mezziah an awe inspiring Game/Web developer who lives in the city of Boston</p> <p >My phone number is: <a href="tel:8576150021">857-615-0021</a></p> <p >My email is <a href="mailto:mezziahkj06@gmail.com">mezziahkj06@gmail.com</a></p> <h2 >My Education</h2> <p >I am a student of Madison Park Vocational High School and was part of the vocation called computer programing I started here in the year 2020 and going to graduate in the year 2024 </p> <h2 >My Skills</h2> <ul > <li >I am a beginner in coding that has a good grasp over HTML and Python.</li> <li >Also know how to use links and CSS in HTML.</li> <li >I also have a little bit of experience in video editing.</li> <li >I have some knowledge Urban planning and global warming.</li> <li >I don't like to start trouble or get in to conflict so i'm great a avoiding it.</li> </ul> <h2 >Work Experiance</h2> <p >I had worked at a job called urban planning twice this summer. During my first year, I had to go around interviewing people about the extreme heat crisis going on and recording heat temperature data near parks, parking-lots, and bus stops. During the second year, me and other second years were part of a group called urban designers because unlike the first years this time we were going to design a cooling pocket park design that will be near Roxbury Community College that entails more interviews and lot of planning brainstorming and decisions.</p> <p >After my second year, of urban planning ended they gave all the second years a internship to take apart of my internship was with the ABC also known as A Better City. While working at A Better City they made me look at some research that was conducted in Boston. One of these were called the urban doom loop and city of Boston heat plan not just that but I went on trips to the BU/Boston University to see there new thermal heating structure that will be green in energy and Boston Medical Center to see there roof top garden.</p> <h2 >Hobbies</h2> <ul > <li >Playing video games.</li> <li >Going on walks.</li> <li >Cooking/Learning how to cook.</li> <li >watching movies and videos.</li> <li >making YouTube videos even do I haven't done it in a while.</li> </ul> <h2 >Goals</h2> <ol > <li >One of my goals is to make a full fledged game that lots of people will like.</li> <li >Another goal is to get a job that I will enjoy.</li> <li >My third goal is to life easier for my mom so she can truly have a break from the stress.</li> <li >The last goal is to live a life I won't regret or to have fun every chance I get.</li> </ol> <br> <script src="https://replit.com/public/js/replit-badge-v2.js" theme="dark" position="bottom-right"></script> <!-- Malique and Charles Bellone helped me if anyone's interested--> </body> </html>
html {
height: 100%;
width: 100%;
margin: 0;
}
#port>nav {
display: block;
width: 100%;
height: 25px;
background-color: #e6b241;
color: #e292d7;
}
#navigation a {
display: inline-block;
width: 15%;
height: 25px;
color: #b361a8;
font-family: 'Montserrat', sans-serif;
font-family: 'Roboto Mono', monospace;
}
#port>nav a:visited {
color: mediumpurple;}
#port>nav a:hover {
color: hotpink;
}
#port {
background-image: url(https://images.unsplash.com/photo-1507525428034-b723cf961d3e?ix)
}
#res {
color: white;
background-image: url(img/back1r2.png);
background-repeat: no-repeat;
background-size: 200%;
}
#res>nav {
display: block;
width: 100%;
height: 25px;
background-color: black;
color: whitesmoke;
}
#res>nav a{
display: inline-block;
width: 15%;
height: 25px;
color: darkgrey;
}
#res>nav a:visited {
color: goldenrod;}
#res>nav a:hover {
color: lime;
}
#pro {
padding: 20px;
color: white;
background-image: url(img/back2.png);
background-repeat: no-repeat;
background-size: 100%;
}
#pro>nav {
display: block;
width: 100%;
background-color: #d95ed9;
color: #53c4ea;
}
#pro>nav a{
display: inline-block;
width: 15%;
height: 25px;
color: blue;
font-family: 'Montserrat', sans-serif;
}
#pro>nav a:visited {
color: cyan;}
#pro>nav a:hover {
color: greenyellow;
}
.pg2 a {
color: cyan;}
.pg2 a:hover {
color: deeppink;
}
#ref {
background-image: url(img/back1r.jpeg);
background-repeat: no-repeat;
background-size: 100%;
}
#ref button{
color: black;
}
.pg4{
color: black;
}
#ref>nav {
display: block;
width: 100%;
background-color: silver;
color: gold;
}
#ref>nav a{
display: inline-block;
width: 15%;
height: 25px;
color: crimson;
font-family: 'Montserrat', sans-serif;
}
#ref>nav a:visited {
color: darkorange;
}
#ref>nav a:hover {
color: lemonchiffon;
}
#cert {
background-image: url(img/back3.png);
background-repeat: no-repeat;
background-size: 100%;
}
#cert button{
color: blue;
}
#cert>nav {
display: block;
width: 100%;
background-color: #0d0d8c;
color: #e6cf8e;
}
#cert>nav a{
display: inline-block;
width: 15%;
height: 25px;
color: gold;
font-family: 'Montserrat', sans-serif;
}
#cert>nav a:visited {
color: goldenrod;
}
#cert>nav a:hover {
color: #e56e43;
}
#ex {
background-color: black;
color: #43ea43;
}
#ex>nav {
display: block;
width: 100%;
color: darkgreen;
}
#ex>nav a{
display: inline-block;
width: 15%;
height: 25px;
color: #43ea43;
font-family: 'Montserrat', sans-serif;
}
#ex>nav a:visited {
color: #ec0e3a;
}
#ex>nav a:hover {
color: lightgreen;
}
@media only screen and (max-width:500px) {
/* For mobile phones: */
#navigation, a,.pg1, .pg2, .pg3, .pg4, .pg5 {
width: 100%;
}
}
@media only screen and (max-width:500px) {
/* For mobile phones: */
#pro{
background-repeat: no-repeat;
background-size: 200%;
}
#res
{
background-repeat: no-repeat;
background-size: 750%;
}
nav>a{
font-size:2vw;
}
#cert{
font-size: 1.8vw;
}
}
button {
background-color: transparent;
color: white;
font-size: larger;
}