Untitled
unknown
plain_text
2 years ago
3.4 kB
3
Indexable
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My Website</title>
<style>
*{
margin: 0px;
padding: 0px;
}
#header .heading{
text-align: center;
}
.text-align{
text-align: center;
}
#header .menu-list ul li{
margin-right: 10px;
}
ul li{
list-style: none;
}
.flex{
display: flex;
}
#header .menu-list .menu-sg{
padding: 20px 0px;
}
#header .menu-list ul li a{
text-decoration: none;
padding: 8px 20px;
transition: 0.5s;
}
#header .menu-list ul li a:hover{
color: #ffbc06;
}
#header .menu-list ul li a.active{
color: #ffbc06;
}
.container{
width: 1140px;
margin: auto;
}
.page-test .container .sen-1{
margin-bottom: 20px;
}
.page-test .heading-sub{
margin-bottom: 10px;
}
.sen-2 .sub-list{
margin-left: 30px;
}
.sen-2 .sub-list li{
list-style: decimal;
}
#footer{
margin-top: 10px;
}
.w-100{
width: 100%;
}
#footer{
padding: 10px 0px 10px 0px;
}
.bg-color{
background-color: #f7e9c2;
}
</style>
</head>
<body>
<header>
<div>
<h1 class="heading text-align">Welcome to My Website</h1>
</div>
<div class="w-100 bg-color">
<div class="container">
<div id="header">
<nav class="menu-list">
<ul class="flex menu-sg">
<li>
<a href="#" class="active">Home</a>
</li>
<li>
<a href="#">About</a>
</li>
<li>
<a href="#">Contact</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
</header>
<main class="page-test">
<div class="container">
<div class="main sen-1">
<h2 class="heading-sub">About Me</h2>
<p>Hi, my name is John Doe and I'm a frontend developer.</p>
</div>
<div class="main sen-2">
<h2 class="heading-sub">My Skills</h2>
<ul class="sub-list">
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
</ul>
</div>
</div>
</main>
<footer>
<div class="w-100 bg-color">
<div class="container">
<div id="footer">
<p>2023 My Website. All rights reserved.</p>
</div>
<div>
</div>
</footer>
</body>
</html>