Vertikal menyu
CSS yordamida vertikal menyu yaratishni o‘rganing.
Vertikal menyu
Vertikal tugmalar guruhi qanday yaratiladi
1-qadam) HTML qo‘shing:
Misol
<div class="vertical-menu">
<a href="#" class="active">Home</a>
<a href="#">Link 1</a>
<a href="#">Link 2</a>
<a href="#">Link 3</a>
<a href="#">Link 4</a>
</div>
2-qadam) CSS qo‘shing:
Misol
.vertical-menu {
width: 200px; /* Set a width if you like */
}
.vertical-menu a {
background-color: #eee; /* Grey background color */
color: black; /* Black text color */
display: block; /* Make the links appear below each other */
padding: 12px; /* Add some padding */
text-decoration: none; /* Remove underline from links */
}
.vertical-menu a:hover {
background-color: #ccc; /* Dark grey background on mouse-over */
}
.vertical-menu a.active {
background-color: #04AA6D; /* Add a green color to the "active/current" link */
color: white;
}
O‘zingiz sinab ko‘ring »
Vertikal aylantiriladigan menyu
Vertikal aylantiriladigan menyu kerak bo‘lsa, aniq height belgilang va overflow xossasini qo‘shing:
Maslahat: Qotirilgan, to‘liq balandlikdagi yon navigatsiyani qanday yaratishni bilish uchun Qanday qilinadi — Yon navigatsiya darsligimizni ko‘rib chiqing.
W3Schools Pathfinder
Yutuqlaringizni kuzating – bu bepul!