لوردناين كتب:مرحبآ, أين تُريدينه ان يكون فعال؟ وممكن الرابط المُباشر للمثال أعلاه من أي موقع هو

الكود:

a span[style="color:#FF0F0F"] strong {
background:url(http://i19.servimg.com/u/f19/18/04/55/46/45310.png) no-repeat;
padding-left:17px;}

a[href="/u1"] strong {
    position: relative;
}
a[href="/u1"] strong:hover::after {
    background-color: rgba(0, 0, 0, 0.5);
    border-radius: 5px;
    color: rgb(255, 255, 255);
    content: "المدير العام";
    display: inline-block;
    font-size: 14px;
    font-weight: bold;
    padding: 2px;
    position: absolute;
    right: 0;
    top: -15px;
    white-space: nowrap;
    z-index: 1;
}


JAR7 كتب:اضف بعد كود الاخ ده

الكود:

 
    background-color: rgba(0, 0, 0, 0.5);
    border-radius: 5px;
    color: rgb(255, 255, 255);
    content: "المدير العام";
    display: inline-block;
    font-size: 14px;
    font-weight: bold;
    padding: 2px;
    position: absolute;
    right: 0;
    top: -15px;
    white-space: nowrap;
    z-index: 1;



حيث يتغير دة بعدد بيناتك /u466

الكود:

a[href="/u"] strong {
position:relative;
}
a[href="/u"] strong:hover:after {
background: #FF0000;/*رمز اللون للمجموعة*/
content: "احــلى ادارى";
border-radius:5px;
font-weight:bold;
font-size:11px;
padding:2px;
color:#fff;
position:absolute;
bottom:15px;
left:0px;
display:inline-block;
white-space:nowrap;
z-index:1;
}

JAR7 كتب:عملت تعديل كنت ادرس الكود المهم تم لم انتبهه لردك

نقص بعض الاوامر بورقة css  وتم اكمالها

شكرا للمتابعه هع

التغيير يكون /u1 بعدد بيناتك

الكود:

a[href="/u1"] strong {
    position: relative;
}