• منتديات شباب الرافدين .. تجمع عراقي يقدم محتوى مميز لجميع طلبة وشباب العراق .. لذا ندعوكم للانضمام الى اسرتنا والمشاركة والدعم وتبادل الافكار والرؤى والمعلومات. فأهلاَ وسهلاَ بكم.

شرح عام XF تلوين اسماء الاعضاء بـ CSS احترافي Zenforo

Ibn AliraQ

ヅ واحد من الناس ヅ
المدير العام للمنتديات
إنضم
2018-08-28
المشاركات
17,413
مستوى التفاعل
6,778
النقاط
297
الإقامة
العراق
جوهرة
დ117,925
الجنس
ذكر
السلام عليكم ورحمة الله وبركاته
ويانا اليوم شرح :
اذهب الى
الأعضاء > مجموعات الأعضاء > المجموعه المراد تلوينها
و اضف فى خانه ال css التالي :

مثلا الادارة :

ZiY88p0.jpg

استخدم الكود التالي :

CSS:
line-height: 18px;
padding: 0px 15px;
font-size: 12px;
font-color: white:
font-weight: bold;
background-color: rgb(128, 0, 0);
color: rgb(240,255,255);
border-radius: 5px 5px 5px 5px;
transition: background-color 0.2s linear 0s;
border: 1px solid rgba(0, 0, 0, 0.2);
box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 0.4) inset, 0px 1px rgb(255, 255, 255);
text-shadow: 0px -1px rgba(0, 0, 0, 0.2);
text-align: center;
min-width: 45px;
width: 50;
height: 20;

الان كرر العملية مع باقي المجموعات:

V0FZT8H.jpg

استخدم الكود التالي :

CSS:
line-height: 18px;
   padding: 0px 15px;
   font-size: 12px;
   font-weight: bold;
   background-color: rgb(0, 165, 240);
   color: rgb(255, 255, 255);
   border-radius: 5px 5px 5px 5px;
   transition: background-color 0.2s linear 0s;
   border: 1px solid rgba(0, 0, 0, 0.2);
   box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 0.4) inset, 0px 1px rgb(255, 255, 255);
   text-shadow: 0px -1px rgba(0, 0, 0, 0.2);
   text-align: center;
   min-width: 45px;
   width: 50;
   height: 20;

yHgYkld.jpg

CSS:
line-height: 18px;
   padding: 0px 15px;
   font-size: 12px;
   font-weight: bold;
   background-color: rgb(138,43,226);
   color: rgb(255, 255, 255);
   border-radius: 5px 5px 5px 5px;
   transition: background-color 0.2s linear 0s;
   border: 1px solid rgba(0, 0, 0, 0.2);
   box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 0.4) inset, 0px 1px rgb(255, 255, 255);
   text-shadow: 0px -1px rgba(0, 0, 0, 0.2);
   text-align: center;
   min-width: 45px;
   width: 50;
   height: 20;

Ye8sjvA.jpg

CSS:
line-height: 18px;
    padding: 0px 15px;
    font-size: 12px;
    font-weight: bold;
    background-color: rgb(0,100,0);
    color: rgb(255, 255, 255);
    border-radius: 5px 5px 5px 5px;
    transition: background-color 0.2s linear 0s;
    border: 1px solid rgba(0, 0, 0, 0.2);
    box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 0.4) inset, 0px 1px rgb(255, 255, 255);
    text-shadow: 0px -1px rgba(0, 0, 0, 0.2);
    text-align: center;
    min-width: 45px;
    width: 50;
    height: 20;

uVQEN5v.jpg

CSS:
line-height: 18px;
   padding: 0px 15px;
   font-size: 12px;
   font-weight: bold;
   background-color: rgb(255,140,0);
   color: rgb(255, 255, 255);
   border-radius: 5px 5px 5px 5px;
   transition: background-color 0.2s linear 0s;
   border: 1px solid rgba(0, 0, 0, 0.2);
   box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 0.4) inset, 0px 1px rgb(255, 255, 255);
   text-shadow: 0px -1px rgba(0, 0, 0, 0.2);
   text-align: center;
   min-width: 45px;
   width: 50;
   height: 20;

وهكذا .. عدل على الكود حسب ما يناسبك من لون لكل مجموعة.

مودتي
 
عودة
أعلى أسفل