الســلام وعليكم ورحمة الله

الهاك تم طرحه في كثير من المنتديات ولكن كان بدون شرح او كان الشرح صعب على بعض الاشخاص

ولكن حبيت ابسط واوضح طريقة التركيب

======

ملاحظه : لاتصلح هذه الطريقه الا اذا كنت تستخدم المربعات للاسماء

والحين الطريقه

اولا >>>

رفع الصور المرفقه الى داخل مجلد الصور بالمنتدى vb/images



ثانيا>>

ادخل على الاستايلات من لوحة تحكم المنتدى

اختار الاستايل المطلوب التغيير عليه

اضغط على كلمة اذهب

في التعريف الاضافي للاستايل

تجده بالاسفل

تعاريف CSS الإضافية/Additional CSS Definitions

[Link nur für registrierte Benutzer sichtbar]

الان كل مجموعه تجد اخرها الكود التالي

background-image: url('altaer/color_bg.gif');

بدل الكود بالكود التالي

background-image: url('images/b1.gif');

لاحظ الكود القديم ولاحظ الكود الجديد ( بعد التعديل ) كما بالصورة

[Link nur für registrierte Benutzer sichtbar]

لاتنسى

ان كل مجموعه لها صورة معينه

وبالنهاية يصبح شكل البرمجه النهائيه للمجموعات كالتالي

وهي جاهزه لاتحتاج تغيير انسخها والصقها فقط ( الشرح السابق وضع لمعرفه كيفيه التعديل على الهاك )

/* ***** styling for 'big' usernames on postbit etc. ***** */
.bigusername { font-size: 14pt; }

/* ***** small padding on 'thead' elements ***** */
td.thead, div.thead { padding: 4px; }

/* ***** basic styles for multi-page nav elements */
.pagenav a { -decoration: none; }
.pagenav td { padding: 2px 4px 2px 4px; }

/* ***** define margin and font-size for elements inside panels ***** */
.fieldset { margin-bottom: 6px; }
.fieldset, .fieldset td, .fieldset p, .fieldset li { font-size: 11px; }

/* ***** don't change the following ***** */
form { display: inline; }
label { cursor: default; }
.normal { font-weight: normal; }
.inlineimg { vertical-align: middle; }



/* ***** Navbar ***** */
.navbar1
{
color: #FFFFFF;
font: bold 10px tahoma, verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
padding: 3px 6px 3px 6px;
white-space: nowrap;

}
.navbar1 a:link
{
color: #032E78;
-decoration: none;
}
.navbar1 a:visited
{
color: #032E78;
-decoration: none;
}
.navbar1 a:hover, .navbar1 a:active
{
color: #666666;
-decoration: underline;
}
.red
{
margin: 0px 0px 0px 0px;
width:48;
border: 2px solid #FF1515;
cursor: pointer;
font-family:MS Sans Serif;
font-size:10px;
vertical-align:middle;
letter-spacing:0;
color:#FF1515;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#FFE3DF;
background-image: url('images/b3.gif');
-align:center;
}

.green
{
margin: 0px 0px 0px 0px;
width:48;
border: 1px solid #008000;
cursor: pointer;
font-family:MS Sans Serif;
font-size:10px;
vertical-align:middle;
letter-spacing:0;
color:#008000;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#F0FFFF;
background-image: url('images/b1.gif');
-align:center;
}

.blue
{
margin: 0px 0px 0px 0px;
width:48;
border: 1px solid #0000FF;
cursor: pointer;
font-family:MS Sans Serif;
font-size:10px;
vertical-align:middle;
letter-spacing:0;
color:#0000FF;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#F0FFFF;
background-image: url('images/b2.gif');
-align:center;
}

.gray
{
margin: 0px 0px 0px 0px;
width:48;
border: 1px solid #CCCCCC;
cursor: pointer;
font-family:MS Sans Serif;
font-size:10px;
vertical-align:middle;
letter-spacing:0;
color:#CCCCCC;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#F0FFFF;
background-image: url('images/b1.gif');
-align:center;
}

.fushia
{
margin: 0px 0px 0px 0px;
width:48;
border: 1px solid #FF66CC;
cursor: pointer;
font-family:MS Sans Serif;
font-size:10px;
vertical-align:middle;
letter-spacing:0;
color:#FF66CC;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#F0FFFF;
background-image: url('images/b1.gif');
-align:center;
}

.orang
{
margin: 0px 0px 0px 0px;
width: 48;
border: 1px solid #FF9900;
cursor: pointer;
font-family:MS Sans Serif;
font-size:10px;
vertical-align:middle;
letter-spacing:0;
color:#FF9900;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#F0FFFF;
background-image: url('images/b1.gif');
-align:center
}

.teal
{
margin: 0px 0px 0px 0px;
width: 48;
border: 1px solid #008080;
cursor: pointer;
font-family:MS Sans Serif;
font-size:10px;
vertical-align:middle;
letter-spacing:0;
color:#008080;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#F0FFFF;
background-image: url('images/b1.gif');
-align:center;
}

.brown
{
margin: 0px 0px 0px 0px;
width: 48;
border: 1px solid #BF0000;
cursor: pointer;
font-family:MS Sans Serif;
font-size:10px;
vertical-align:middle;
letter-spacing:0;
color:#BF0000;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#F0FFFF;
background-image: url('images/b8.gif');
-align:center;
}

.pink
{
margin: 0px 0px 0px 0px;
width: 48;
border: 1px solid #CC33FF;
cursor: pointer;
font-family:MS Sans Serif;
font-size:10px;
vertical-align:middle;
letter-spacing:0;
color:#CC33FF;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#F0FFFF;
background-image: url('images/b1.gif');
-align:center;
}

.black
{
margin: 0px 0px 0px 0px;
width: 48;
border: 1px solid #000000;
cursor: pointer;
font-family:MS Sans Serif;
font-size:10px;
vertical-align:middle;
letter-spacing:0;
color:#000000;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#F0FFFF;
background-image: url('images/b4.gif');
-align:center;
}

.white
{
margin: 0px 0px 0px 0px;
width: 48;
border: 1px solid #ffffff;
cursor: pointer;
font-family:MS Sans Serif;
font-size:10px;
vertical-align:middle;
letter-spacing:0;
color:#ffffff;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#F0FFFF;
background-image: url('images/b3.gif');
-align:center;
}

الصور في الملفات المرفقة

المربعات المتحركه - شبكةومنتديات شوق السعوديه ([Link nur für registrierte Benutzer sichtbar])

مغلق