Scribd
Upload
2 views2 pages

{

The document contains CSS styles for a navigation bar, defining layout, spacing, and hover effects for links. It includes styles for the logo, navigation links, and icons, ensuring a responsive and visually appealing design. Key features include flexbox for alignment and transition effects for interactive elements.

Uploaded by

SHIVAM SINGH
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
2 views2 pages

{

The document contains CSS styles for a navigation bar, defining layout, spacing, and hover effects for links. It includes styles for the logo, navigation links, and icons, ensuring a responsive and visually appealing design. Key features include flexbox for alignment and transition effects for interactive elements.

Uploaded by

SHIVAM SINGH
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 2

{

margin: 0;
padding: 0;
}
/*navbar*/
.navbar{
display: flex;
align-items: center;
margin-top: 10px;
}
.logo img{
margin-top:10px ;
margin-left: 15px;
}

.nav a {
position: relative;
font-size: 1.1em;
color:#333;
font-weight: 600;
text-decoration: none;
margin-left: 30px;
padding: 6px 15px;
transition: .5s;
}

.nav a:hover,
.nav a.active {
color: #fff;

}
.nav a span{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: #333;
border-radius: 30px;
z-index: -1;
transform: scale(0);
opacity: 0;
transition: .5s;
}

.nav a:hover span,


.nav a.active span {
transform: scale(1);
opacity: 1;
}

.nav {
display:flex ;
margin-left: 86px;
margin-top:20px;

}
.nav a{
list-style: none;
margin-left: 1rem;
font-family: Arial, Helvetica,Sans-Serif;
font-size:0.90rem;
font-weight: 600;
}

.end{
display: flex;
margin-left: 280px;
}

.icon i{
margin-top: 1.5rem;
margin-left: 20px;
}

.icon i{
font-size: 22px;
margin-left:12px;
}
}
}

You might also like