اضافة مميزة لقالب النافبار navbar بشكل جذاب بتقنية CSS

[ال مطور]

اضافة مميزة لقالب النافبار navbar بشكل جذاب بتقنية CSS (http://www.6wer.net/vb)
مناسب لخلفية المنتديات البيضاء

:: صورة الاضافة ::

http://up.arab-x.com/Dec11/r4Q50423.gif


<br />
<div id="navbar">
<span class="inbar">
<ul>
<li><a href="http://www.6wer.net"><span>الرئيسية</span></a></li>
<li><a href="http://www.6wer.net"><span>شبكة طورنت</span></a></li>
<li><a href="http://www.6wer.net"><span>لوحة التحكم</span></a></li>
<li><a href="http://www.6wer.net"><span>المشاركات الجديدة</span></a></li>
</ul>
</span>
</div>
<br />


قم بتغيير المسميات والروابط في الكود .

2- ارفع مجلد navbar في مجلد images
[ الصور في المرفقات ]

3- اضف في خصائص CSS الاضافية الكود التالي :
/* Designed by: AlM6weR */
/* Site: http://www.6wer.net/vb */
/* الخلفية الثابته */
#navbar{
width:auto;
height:40px;
background:url(navbar/navbar-bg.gif) left top repeat-x;
}
/* الجهة اليمنى من الخلفية الثابته */
#navbar .inbar{
display:block;
height:40px;
background:url(navbar/right-round.gif) right top no-repeat;
}
#navbar ul, #navbar ul li{
border:0px;
margin:0px;
padding:0px;
list-style:none;
height:20px;
line-height:40px;
}
/* الجهة اليسرى من الخلفية الثابته */
#navbar ul{
background:url(navbar/left-round.gif) left top no-repeat;
}
#navbar ul li{
float:right;
display:block;
line-height:36px;
}
#navbar ul li a{
color:#403e32;
text-decoration:none;
font:bold 11px Tahoma;
display:block;
}
#navbar ul li a span{
padding:0 20px 0 0;
height:40px;
line-height:36px;
display:block;
margin-left:20px;
}
/* الجهه اليسرى من لون التأشير */
#navbar ul li a:hover{
background:url(navbar/ahover-bg.gif) left top no-repeat;
height:40px;
line-height:36px;
}
/* الجهه اليمين من لون التأشير */
#navbar ul li a:hover span{
background:url(navbar/spanhover-bg.gif) right top no-repeat;
height:40px;
line-height:36px;
}

بالتوفيق للجميع ..

[abohmam]

جزاك الله خيرا اخانا المطور

طريقة مميزة وجميلة لإستخدام هذه البرمجة فى المنتدى

فى إنتظار المزيد ان شاء الله

لك التحية والشكر

[ال مطور]

جزاك الله خيرا اخانا المطور

طريقة مميزة وجميلة لإستخدام هذه البرمجة فى المنتدى

فى إنتظار المزيد ان شاء الله

لك التحية والشكر

واياك اخوي ابوهمام
اتمنى تقديم المفيد والجديد
كما اشكر على مرورك الجميل لموضوعي المتواضع ..

[أبو يوسف]

جزاك الله خيرا اخانا الكريم المطور وبارك الله فيك

[العربية]

مشكوووووور أخي

[روحي فداك]

مشكوووووووووووووووووووور

[علي حليم]

شـكــ وبارك الله فيك ـــرا لك ... لك مني أجمل تحية .

[جروح بارده]

مشاااركه مميزة

بارك الله فيك

[عبدوووو]

شكررررررررررررررررررررررر ررررررا

[أبو صخر]

شـكــ وبارك الله فيك ـــرا لك ... لك مني أجمل تحية .

[النصبي]

موفق بإذن الله ... لك مني أجمل تحية .

[تامر شاهر]

شـكــ وبارك الله فيك ـــرا لك ... لك مني أجمل تحية . :abc_022: :abc_022:

[أبو فارس]

بسم الله الرحمن الرحيم

شـكــ وبارك الله فيك ـــرا لك ... لك مني أجمل تحية .

[شادي عبد]

:abc_005: شـكــ وبارك الله فيك ـــرا لك ... لك مني أجمل تحية .

[عامر الصعدي]

جزاك الله خيرا اخانا المطور

طريقة مميزة وجميلة لإستخدام هذه البرمجة فى المنتدى

فى إنتظار المزيد ان شاء الله

لك التحية والشكر

[بولبابة]

merci beaucoup :abc_152::abc_152::abc_152::abc_152::abc_152::abc_ 152::abc_152::abc_152:

[جميل علي]

جزاك الله خيرا اخانا المطور

[سهارى]

شـكــ وبارك الله فيك ـــرا لك ... لك مني أجمل تحية .

[عبده النجار]

شكررررررررررررررررررررررر ررررررا

[محـب الحسين]

شكرا جزيلا