رتب المتواجدين

[ريكيلمي]

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

اريد احط رتب المتواجدين في ايطار
مثل www.suae.net

رتب الاعضـاء مع المتواجدين في ايطــار

[بحــــــــر]

للأسف الموقع مغلق للصيانة
ولكن اذا تقصد وضع اسماء الاعضاء داخل مربعات الطريقة كما يلي
لوحة التحكم لمنتدى
التحكم بالاستايلات
اختار الاستايل ثم اضغط (( اذهب))
اختار الجدول التالي
تعاريف CSS الإضافية/Additional CSS Definitions
في اخر المربع الاول اضف الكود التالي

.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:#FAF0DA; 
background-image: url('altaer/color_bg.gif'); 
text-align:center; 
} 
.PaleGreen 
{ 
margin: 0px 0px 0px 0px; 
width:48; 
border: 2px solid #006600; 
cursor: pointer; 
font-family:MS Sans Serif; 
font-size:10px; 
vertical-align:middle; 
letter-spacing:0; 
color:#006600; 
padding-left:0; 
padding-right:0; 
padding-top:0; 
padding-bottom:0; 
background-color:#FAF0DA; 
background-image: url('altaer/color_bg.gif'); 
text-align:center; 
} 
.blue 
{ 
margin: 0px 0px 0px 0px; 
width:48; 
border: 2px 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:#FAF0DA; 
background-image: url('altaer/color_bg.gif'); 
text-align:center; 
} 
.gray 
{ 
margin: 0px 0px 0px 0px; 
width:48; 
border: 2px 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:#FAF0DA; 
background-image: url('altaer/color_bg.gif'); 
text-align:center; 
} 
.fushia 
{ 
margin: 0px 0px 0px 0px; 
width:48; 
border: 2px 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:#FAF0DA; 
background-image: url('altaer/color_bg.gif'); 
text-align:center; 
} 
.orang 
{ 
margin: 0px 0px 0px 0px; 
width: 48; 
border: 2px 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:#FAF0DA; 
background-image: url('altaer/color_bg.gif'); 
text-align:center 
} 
.teal 
{ 
margin: 0px 0px 0px 0px; 
width: 48; 
border: 2px 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:#FAF0DA; 
background-image: url('altaer/color_bg.gif'); 
text-align:center; 
} 
.brown 
{ 
margin: 0px 0px 0px 0px; 
width: 48; 
border: 2px 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:#FAF0DA; 
background-image: url('altaer/color_bg.gif'); 
text-align:center; 
} 
.pink 
{ 
margin: 0px 0px 0px 0px; 
width: 48; 
border: 2px solid #999999; 
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:#FAF0DA; 
background-image: url('altaer/color_bg.gif'); 
text-align:center; 
} 
.black 
{ 
margin: 0px 0px 0px 0px; 
width: 48; 
border: 2px 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:#FAF0DA; 
background-image: url('altaer/color_bg.gif'); 
text-align:center; 
} 
.white 
{ 
margin: 0px 0px 0px 0px; 
width: 48; 
border: 2px solid #A8A8A8; 
cursor: pointer; 
font-family:MS Sans Serif; 
font-size:10px; 
vertical-align:middle; 
letter-spacing:0; 
color:#A8A8A8; 
padding-left:0; 
padding-right:0; 
padding-top:0; 
padding-bottom:0; 
background-color:#FAF0DA; 
background-image: url('altaer/color_bg.gif'); 
text-align:center; 
} 

شرح تعديل اللون والخلفية لكل مجموعة لونية :

.white 
{ 
margin: 0px 0px 0px 0px; 
width: 48; 
border: 2px solid #A8A8A8; 
cursor: pointer; 
font-family:MS Sans Serif; 
font-size:10px; حجم الخط 
vertical-align:middle; 
letter-spacing:0; 
color:#A8A8A8;    لون الخط         
padding-left:0; 
padding-right:0; 
padding-top:0; 
padding-bottom:0; 
background-color:#FAF0DA;    لون الخلفية 
background-image: url('altaer/color_bg.gif'); 
text-align:center; 
} 

بعد الانتهاء حفظ العمل واتجة الى مجموعات الاعضاء :
وفي كل مجموعة مخصصة مثلا الاعضاء
في خيار
اسم العضو بصيغة HTML
في المربع اللي على اليمين اضف الكود التالي :

<input type="text" name="T1" size="17" class="PaleGreen" value=" 

في هذا المربع بأمكانك تغيير قيمة :

class="PaleGreen 

الى اي لون تريدة مثلا هنا سوف تظهر امجموعة الاعضاء بالون الاخضر
لو حطيت red بدلا من PaleGreen سوف تظهر المجموعة بالون الاحمر وهكذا مع كل مجموعة

في المربع اللى على الليسار اضف الكود التالي:

" readonly style="width: 90"> 

بعد الانتهاء من تخصيص وتحديد اللون لكل مجموعة
يجب تحديث الالقاب من الصيانة

[ريكيلمي]

تشكر على الشرح الوافي

[بحــــــــر]

حياك الله يالغالي

[أبو فهد]

الله يعطيك العافية يابحر
ثانك لك