[css] ظ‚ط§ط¦ظ…ط© ط§ظپظ‚ظٹط© ط±ط§ط¦ط¹ط© ط£ط¹ظ„ظ‰ ط§ظ„ظ…ظ†طھط¯ظ‰


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

السلام عليكم ورحمة الله وبركاته...~


اليوم اقدم لكم
كود code مبرمجة بنظام css
لوضع قائمة افقية في اعلى المنتدى forum
يعني تبقى دائماً في اعلى المنتدى forum
وذلك اختصار لروابط المنتدى forum مثل ( الرئيسية .. المنتدى forum .الخ )

أولاً

المثال الحي هنا ..

المثال المصور هنا ..


ثانياً


طريقة التركيب install سهلة جداً




افتح قالب template header
وضع هذا الكود code في اول القالب template

 رمز PHP:
<code style="white-space:nowrap"> <code> <ul id="menu" style="text-align: right">
<li><a href="#" title="الرئيسية">:: الرئيسية ::</a></li>
<li><a href="#" title="المنتدى forum">:: المنتدى forum ::</a></li>
<li><a href="#" title="مركز الرفع">:: مركز الرفع ::</a></li>
<li><a href="#" title="منتدى زيباره">:: منتدى زيباره ::</a></li>
<li><a href="#" title=" الموقع">:: الموقع ::</a></li>
</ul>
</code> </code>


ملاحظة : غير هذه الاشارات ( # ) الى روابط موقعك / منتداك


وافتح CSS الرئيسية للاستايل style
وانزل الى اخرى الصفحة سوف تجد مربعين كبيرة
ضع في المربع الثاني هذه الكود code

 رمز PHP:
<code style="white-space:nowrap"> <code> #menu {
background: #333;
float: left;
list-style: none;
margin: 0;
padding: 0;
width: 100%;
}
#menu li {
float: left;
font: 67.5% "Lucida Sans Unicode", "Bitstream Vera Sans", "Trebuchet Unicode MS", "Lucida Grande", Verdana, Helvetica, sans-serif;
margin: 0;
padding: 0;
}
#menu a {
background: #333 bottom right no-repeat;
color: #ccc;
display: block;
float: left;
margin: 0;
padding: 8px 12px;
text-decoration: none;
}
#menu a:hover {
background: #2580a2 bottom center no-repeat;
color: #fff;
padding-bottom: 8px;
</code> </code>

انتهى ... والان شوف منتداك وتمتع بالقائمة

اتمنى انكم استفتدوا ..










©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى©