اسماء الاعضاء ملونه وداخل مستطيلات روعه

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

عموما انا اتى اليكم بكود لتغيير شكل الاعضاء ولونهم حسب اختيارك وايضا بداخل مستطيلا ت

اولا انا متاسف جدا اذا كان الموضوع مكرر فاذا استوجب غلقه فلا مانع انا بس كنت ابحث من فتره عنه والحمد لله وجدته فاحببت ان افيد به اخوانى

اللمهم نبدا بمشاهد مثال

http://3rabstarz.com/vb

نلاحظ شكل المتواجدون الان داخل مستطيل وايضا بالوان من اختيارنا

عموما نبدا بالشرح

الشرح ماهو صعب بس محتاج تركيز بسيط جدا

اولا ندخل لوحه تحكم المنتدى ثم التحكم بالمجموعات

ثم نختار كل مجموعه يراد التعديل عليها مثل المشرفين المراقبين الاعضاء المديرين وهكذا

انظر الصوره



ثم بعد ذلك نضغط تعديل لكل مجموعه



ثم نضع هذه الاكواد على الترتيب بمعنى الكود رقم واحد فى المكان رقم واحد

كود PHP:
<input type="text" name="T1" size="17" class="green" value="




وايضا الكود رقم اتنين فى المكان رقم 2

كود PHP:
" readonly style="border-style:dotted; border-width:1px; width: 90">


الان ناتى لمرحله معرفه كيف نغير لون كل عضويه نلاحظ فى الكود الاول كلمه green اى بمعنى اخضر
وبالتالى يمكن تغييرها باى لون اخر من الالوان الاتيه على حسب المجموعه اللى تريد تغيير لونها

red أحمر

green أخضر

blue أزرق

gray مش فاكر بالعربى ههههه

fushia فوشيا

band باند

member مابعرف

brown بنى

pink بينك

black اسود

white ابيض

وبعض وضع الكود المناسب لكل مجموعه تاتى المرحله الاخيره

مكان وضع الكود فى الاستايلات اللى تحب العمل عليها

من الاستايلات والقوالب ثم خيارات الاستايلا ت والقوال ثم انظر الصوره



وفى المكان المناسب اللى هو تعاريف CSS الإضافية/Additional CSS Definitions

الكود الاتى
كود PHP:

.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:#E30000;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#FFFFFF;
background-image: url('');
text-align:center;
}

.green
{
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:#FFFFFF;
background-image: url('');
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:#0000E6;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#FFFFFF;
background-image: url('');
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:#FFFFFF;
background-image: url('');
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:#FF6CCF;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#FFFFFF;
background-image: url('');
text-align:center;
}

.band
{
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:#C0C0C0;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#FFFFFF;
background-image: url('');
text-align:center
}

.member
{
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:#222222;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#FFFFFF;
background-image: url('');
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:#FFFFFF;
background-image: url('');
text-align:center;
}

.pink
{
margin: 0px 0px 0px 0px;
width: 48;
border: 2px 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:#FFFFFF;
background-image: url('');
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:#FFFFFF;
background-image: url('');
text-align:center;
}

.white
{
margin: 0px 0px 0px 0px;
width: 48;
border: 2px 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:#FFFFFF;
background-image: url('');
text-align:center;
}




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

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

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

/* ***** de-emphasized text */
.shade, a.shade:link, a.shade:visited { color: #777777; text-decoration: none; }
a.shade:active, a.shade:hover { color: #FF4400; text-decoration: underline; }
.tcat .shade, .thead .shade, .tfoot .shade { color: #DDDDDD; }

/* ***** 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; }
.underline { text-decoration: underline; }