آموزش تگ nav در HTML

6 شهریور 1401
ارسال شده توسط
بدون دسته بندی

آموزش تگ nav در HTML

دوست من سلام امیدوارم حالتون عالی و پر از انرژی باشید. توی این بخش از آموزش html css قراره که با آموزش تگ nav در HTML به صورت کامل آشنا بشید.

 تگ nav در HTML

تگ nav که در HTML از آن استفاده میکنیم در واقع از کلمه Navigation بر گرفته شده است، با استفاده از این تگ میتوانیم یک منوی ناوبری یا Navigation Menu که از تعداد زیادی لینک تشکیل شده است را ایجاد نماییم.

زمانی که حرف از منوی ناوبری میشود منظورمان همان منوی اصلی سایت است که در قسمت بالایی تمام سایت هایی که در گوگل وجود دارند، قرار میگیرد و توسط آن میتوانیم به انواع بخش های سایت مراجعه کنیم. در نتیجه کاربرد تگ nav این است که  بطور کلی نوار های بالایی یا… را با آن ایجاد میکنند.

دو مثال برای تگ nav در HTML

در ادامه دوره آموزشی HTML CSS پروژه محور به چند نمونه از مثال های تگ nav میپردازیم که با این تگ بیشتر و بهتر آشنا شوید و در آینده بتوانیم به سهولت از آن استفاده کنید.

مثال اول : استفاده از تگ nav برای ایجاد منوی بالای صفحه بدون استفاده از کد CSS یا همان استایل.

<body>
  <nav>
     <a href="#">خانه</a>
     <a href="#">فروشگاه</a>
     <a href="#">درباره ما</a>
     <a href="#">تماس با ما</a>
  </nav>
</body>

دومین مثال : استفاده از کد های CSS و استایل دهی به تگ nav

nav{
   background-color:#2D2E2F;
   padding:8px;
} 
nav a{
   color:#fff;
   padding:12px;
   text-decoration:none;
   transition:0.3s;
} 
nav a:hover{
   background-color:#de410f;
}

راستی اگر دنبال آموزش html css پروژه محور هستید می توانید از دوره ی آموزش وردپرس پوش استفاده کنید. جهت مشاهده ی 28 ساعت ویدیو آموزشی با پشتیبانی مادام العمر روی این لینک کلیک کنید

پشتیبانی مرورگرها از تگ nav

در جدول زیر میتوانید مرورگرهای اینترنتی که از تگ nav در HTML پشتیبانی میکنند را مشاهده نمایید و بدانید که آیا از مروگر مورد استفاده شما هم پشتیبانی میکنند یا خیر…

پشتیبانی مرورگر هار از تگ table

پشتیبانی تگ nav از صفات و رویدادهای عمومی

تگ nav قابلیت پشتیبانی از تمام صفات عمومی و رویدادهای عمومی در HTML دارد.

نکات و توضیحات

  • علاوه بر این تگی که باهم آن را بررسی کردیم میتوانید از تگ ul هم استفاده کنید و منو های بصورت عمودی یا افقی را طراحی کنیم.

دستورات CSS پیش فرض

در این بخش به بررسی کد های CSS که میتوانیم با استفاده از آنها و بدون ویرایش خاصی برای تگ nav خود استفاده کنیم که به صورت پیش فرض قرار گرفته اند.

nav {
    display: block;
}
برای امتیاز به این نوشته کلیک کنید!
[کل: 0 میانگین: 0]

در صورتی که مشکلی دارید و قادر به حل آن نیستید می توانید با ما در تماس باشید

فرم درخواست پشتیبانی (فرم زیر پست ها)

برچسب ها:

دیدگاهتان را بنویسید