Navigation Bar عمودی
برای ساخت یک Navigation Bar عمودی با توجه به کد بالا، فقط کافی است که برای گزینشگر a ، خصوصیت display را با مقدار "block" تنظیم کنیم:
مثال (ساخت Navigation Bar عمودي)
a
{
display:block;
width:60px;
background-color:#dddddd;
}
خودتان امتحان کنید »{
display:block;
width:60px;
background-color:#dddddd;
}
توضیح مثال بالا:
- با تنظیم خصوصیت display با مقدار "block" تمام تگ های <a> در یک خط جداگانه قرار می گیرند و تمام فضای لینک قابل کلیک کردن است (نه فقط متن لینک)، و این به ما اجازه می دهد تا عرض لینک را مشخص کنیم.
- عناصر Block به صورت پیشفرض تمام عرض قابل دسترس را اشغال می کنند. ما می توانیم مشخص کنیم که 60 پیکسل از یک خط را اشغال کند.
برای یادگیری بیشتر، یک نگاهی به لینک روبرو بیندازید: style دهی کامل یک navigation bar عمودی
توجه: همیشه عرض تگ <a> استفاده شده در navigation bar را مشخص کنید. اگر انجام این کار را فراموش کنید، IE6 یک نتیجه غیرمنتظره تولید خواهد کرد.
