How to make the Music website using the HTML and CSS (Source Code) || Creating a Website||codeandman
Source code of index.html is here:
<!doctype html>
<html lang = "en-in">
<head>
<link rel="stylesheet" href="style.css">
<title>Music Website using HTML and CSS - codeandman</title>
</head>
<body>
<header>
<nav>
<h1>Gautam Sharma</h1>
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Contact</a></li>
<li><a href="#">Serivces</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">FAQ</a></li>
</ul>
</nav>
<section>
<h1>Music as your passion</h1>
<p>Music is your passion as you all know that the music can change
any one life and can do anything
</p>
</section>
</header>
</body>
</html>
The Source code of style.css is given here:
*{
margin:0;
padding:0;
font-family:cursive;
font-weight:bold;
font-style:italic;
box-sizing:border-box;
}
li{
list-style:none;
}
a{
text-decoration: none;
text-transform: uppercase;
color:#0000EE;
}
header{
height:100vh;
}
nav{
height:10vh;
display: flex;
align-items: center;
justify-content: space-between;
/* background:transparent; */
background:linear-gradient(90deg,aqua 50%, rgb(121, 255, 59) 50%);
}
nav h1{
width:30%;
}
nav ul{
width:70%;
}
ul{
display: flex;
align-items: center;
justify-content: space-between;
}
header section{
display: flex;
align-items: center;
justify-content: center;
height:90vh;
flex-direction: column;
background:linear-gradient(90deg,aqua 50%, rgb(121, 255, 59) 50%);
}
section h1{
width:100vw;
text-align:center;
}
section p {
width:40%;
}
I hope guys that you liked this source code.
LIKE AND SHARE THE VIDEO.
ALSO SUBSCIBE TO THE CHANNEL IF YOU HAVEN'T.
THANK YOU.
Comments
Post a Comment