Bo‘lingan navigatsiya


CSS yordamida "bo‘lingan navigatsiya" panelini yaratishni o‘rganing.


ULASHISH

Bo‘lingan navigatsiya

O‘zingiz sinab ko‘ring »


Bo‘lingan navigatsiya panelini yaratish

1-qadam) HTML qo‘shing:

Misol

<div class="topnav">   <a href="#home">Home</a>   <a href="#news">News</a>   <a href="#contact">Contact</a>   <a href="#about" class="split">Help</a> </div>

2-qadam) CSS qo‘shing:

Misol

/* Create a top navigation bar with a black background color  */ .topnav {   background-color: #333;   overflow: hidden; } /* Style the links inside the navigation bar */ .topnav a {   float: left;   color: #f2f2f2;   text-align: center;   padding: 14px 16px;   text-decoration: none;   font-size: 17px; } /* Change the color of links on hover */ .topnav a:hover {   background-color: #ddd;   color: black; } /* Create a right-aligned (split) link inside the navigation bar */ .topnav a.split {   float: right;   background-color: #04AA6D;   color: white; }
O‘zingiz sinab ko‘ring »

Maslahat: Mobil qurilmalarga mos, moslashuvchan navigatsiya panellarini yaratish uchun Qanday qilinadi — Moslashuvchan yuqori navigatsiya darsligimizni o‘qing.

Maslahat: Navigatsiya panellari haqida ko‘proq bilish uchun CSS navigatsiya paneli darsligimizga o‘ting.

W3Schools Spaces haqida eshitganmisiz? Bu yerda veb-saytingizni noldan yaratishingiz yoki shablondan foydalanishingiz mumkin.

Bepul boshlang ❯

W3Schools Pathfinder

Yutuqlaringizni kuzating – bu bepul!