مشخصات مقاله
-
728
-
0.0
-
3374
-
0
-
0
آموزش ساخت ساید بار شناور در طراحی وب سایت
در این مقاله می آموزیم که چطور با استفاده از کدهای CSS، دکمه های شناور نوار جانبی بسازیم.
چگونه یک side navigation شناور ایجاد کنیم.
قدم اول : کد HTML را اضافه کنید.
مثال :
Hoverable Sidenav Buttons
Hover over the buttons in the left side navigation to open them.
قدم دوم : برای ساخت سایدبار شناور باید از دستورات CSS زیر استفاده کنیم.
مثال ساخت ساید بار شناور :
#mySidenav a {
position: absolute;
left: -80px;
transition: 0.3s;
padding: 15px;
width: 100px;
text-decoration: none;
font-size: 20px;
color: white;
border-radius: 0 5px 5px 0;
}#mySidenav a:hover {
left: 0;
}#about {
top: 20px;
background-color: #4CAF50;
}#blog {
top: 80px;
background-color: #2196F3;
}#projects {
top: 140px;
background-color: #f44336;
}#contact {
top: 200px;
background-color: #555
}
