(*blog_title*)

(*blog_short_description*)

همیار بلاگ اسکای

طراحی و ترجمه قالب های بلاگ اسکای

جستجو
تقویم
مهر 1394
شیدسچپج
1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30
نویسندگان
پیوندها
آمار
تعداد بازدیدکنندگان :
313505
جدیدترین یادداشت‌ها
نظرسنجی
از نظر شما بهترین سیستم وبلاگدهی ایرانی کدام است؟

ساخت منوی افقی استاندارد 

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

در پایان منویی ساخته شده با استفاده از CSS و HTML به صورت زیر خواهیم داشت:

برای ساخت منوی افقی در HTML، ابتدا آیتم های منو را توسط عنصر <ul> به صورت زیر پیاده میکنیم :


HTML

<div id="navcontainer">
<ul id="nav">
   <li><a href="#">Home</a></li>
   <li><a href="#">About</a></li>
   <li><a href="#">Clients</a></li>
   <li><a href="#">Contact Us</a></li>
</ul>
</div>

سپس توسط دستور display:inline در CSS آیتم های منوی مورد نظر را به صورت خطی در محور افقی نمایش میدهیم:


CSS
#nav li{display: inline;list-style-type: none;padding-right: 20px;}

نظرات (1)

  • یکشنبه 6 مرداد 1392 ساعت 20:26
  • مسعود
  • سلام.

    داداش دمت گرم....
    امتیاز: 3 2
    برای نمایش آواتار خود در این وبلاگ در سایت Gravatar.com ثبت نام کنید. (راهنما)

    نام :
    ایمیل :
    وب/وبلاگ :
    ایمیل شما بعد از ثبت نمایش داده نخواهد شد