اضافات تضع لمسة جماليه للاستايل 4:خلفيه متحركه لاسم العضو نبدء اولاً تحمل ملف col

4:خلفيه متحركه لاسم العضو


نبدء
اولاً

تحمل ملف coler الي في المرفقات
وترفعه في مجلد images للاستايل الي انت جاعله يكون الافتراضي

وتضع هذا الكود في اخر ورقة css

<!-- CSS Code, ready for Use -->

<style type="text/css">

<!--

body {scrollbar-face-color:#f3bd4b;

scrollbar-highlight-color:#dea52e;

scrollbar-3dlight-color:#dea52e;

scrollbar-darkshadow-color:#dea52e;

scrollbar-shadow-color:#dea52e;

scrollbar-arrow-color:#6e4000;

scrollbar-track-color:#fff8df;

color:#000000;

font-family:verdana,arial;

font-size:12px}



.red{

border:2px #000000 dotted;

cursor: pointer;

font-family: "Microsoft Sans Serif";

font-size: 8pt;

color:#000000;

border-style:dotted;

padding:0px 15px 0px 15px;

background-color:#FFFFFF;

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

text-align:center;

width:50px;

display:inline-block;

overflow:hidden;

white-space:nowrap;

}



.green{

border:2px #000000 dotted;

cursor: pointer;

font-family: "Microsoft Sans Serif";

font-size: 8pt;

color:#000000;

border-style:dotted;

padding:0px 15px 0px 15px;

background-color:#FFFFFF;

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

text-align:center;

width:50px;

display:inline-block;

overflow:hidden;

white-space:nowrap;

}



.blue{

border:2px #000000 dotted;

cursor: pointer;

font-family: "Microsoft Sans Serif";

font-size: 8pt;

color:#FFFFFF;

border-style:dotted;

padding:0px 15px 0px 15px;

background-color:#FFFFFF;

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

text-align:center;

width:50px;

display:inline-block;

overflow:hidden;

white-space:nowrap;

}



.gray{

border:2px #000000 dotted;

cursor: pointer;

font-family: "Microsoft Sans Serif";

font-size: 8pt;

color:#000000;

border-style:dotted;

padding:0px 15px 0px 15px;

background-color:#FFFFFF;

background-image:url('images/color/no-tf3el.gif');

text-align:center;

width:50px;

display:inline-block;

overflow:hidden;

white-space:nowrap;

}



.fushia{

border:2px #000000 dotted;

cursor: pointer;

font-family: "Microsoft Sans Serif";

font-size: 8pt;

color:#FFFFFF;

border-style:dotted;

padding:0px 15px 0px 15px;

background-color:#FFFFFF;

background-image:url('images/color/nab-admin.gif');

text-align:center;

width:50px;

display:inline-block;

overflow:hidden;

white-space:nowrap;

}



.brown{

border:2px #000000 dotted;

cursor: pointer;

font-family: "Microsoft Sans Serif";

font-size: 8pt;

color:#FFFFFF;

border-style:dotted;

padding:0px 15px 0px 15px;

background-color:#FFFFFF;

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

text-align:center;

width:50px;

display:inline-block;

overflow:hidden;

white-space:nowrap;

}



.pink{

border:2px #000000 dotted;

cursor: pointer;

font-family: "Microsoft Sans Serif";

font-size: 8pt;

color:#FFFFFF;

border-style:dotted;

padding:0px 15px 0px 15px;

background-color:#FFFFFF;

background-image:url('images/color/moshrd-3am.gif');

text-align:center;

width:50px;

display:inline-block;

overflow:hidden;

white-space:nowrap;

}

وتذهب لتعديل المجموعاتوتضع الاكواد في
شكل اسم المستخدم في المجموعة

كما في الترتيب
مجموعة الاداره

 <span class="red">[username]</span>

مجموعة نائب المدير

 <span class="fushia">[username]</span>

مجموعة المشرف العام

 <span class="pink">[username]</span>

مجموعة المشرف

 <span class="green">[username]</span>

مجموعة الاعضاء

 <span class="blue">[username]</span>

مجموعة الموقوفين

 <span class="gray">[username]</span>

هذه الطريقه مأخوذه من اسماعلينو لكن
انا طورة الصور
يعني انت عندك 5 صور بس وانا رتبتهم
على هذا الشكل
اذا تريد تغيير الصوره تغير اسم اللون مثل red الى green

هي الالوان مش مرتبه على اسامي الوانا يعني red الصوره تكون ذهبيه وهيك
وهذا مثال

www.kesoft.net

وشكرا