[شرح] : القلوب المتطايرة على مسميات الاعضاء

<div><div align="center"><font size="5">السلام علكم ورحمة الله

كل عام وانتم بخير بعد الزحمة :nosweat:

اولا اعطيك مثال على الشرح

http://www.g1m9.com/vb

شوفو المتواجدين الان وخلال 24 ساعة وداخل المواضيع وفي كل مكان تظهر

وهي حركة رائعة فعلا

نأتي بالشرح

نرفع الصورة المرفة الى مجلد الصورة

ثم نذهب الى

تعاريف css

ونضع هالكود

رمز PHP:

.red
{
margin: 0px 0px 0px 0px;
*****: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:#FFE3DF;
background-image: url('altaer/color_bg.gif');
****-align:center;
}

.green
{
margin: 0px 0px 0px 0px;
*****:48;
border: 2px solid #008000;
cursor: pointer;
font-family:MS Sans Serif;
font-size:10px;
vertical-align:middle;
letter-spacing:0;
color:#008000;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#F0FFFF;
background-image: url('altaer/color_bg.gif');
****-align:center;
}
.blue
{
margin: 0px 0px 0px 0px;
*****: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:#F0FFFF;
background-image: url('altaer/color_bg.gif');
****-align:center;
}
.gray
{
margin: 0px 0px 0px 0px;
*****:48;
border: 1px 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:#F0FFFF;
background-image: url('altaer/color_bg.gif');
****-align:center;
}

.fushia
{
margin: 0px 0px 0px 0px;
*****: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:#F0FFFF;
background-image: url('altaer/color_bg.gif');
****-align:center;
}
.orang
{
margin: 0px 0px 0px 0px;
*****: 48;
border: 1px 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:#F0FFFF;
background-image: url('altaer/color_bg.gif');
****-align:center
}

.teal
{
margin: 0px 0px 0px 0px;
*****: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:#F0FFFF;
background-image: url('altaer/color_bg.gif');
****-align:center;
}
.brown
{
margin: 0px 0px 0px 0px;
*****: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:#F0FFFF;
background-image: url('altaer/color_bg.gif');
****-align:center;
}
.pink
{
margin: 0px 0px 0px 0px;
*****: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:#F0FFFF;
background-image: url('altaer/color_bg.gif');
****-align:center;
}
.black
{
margin: 0px 0px 0px 0px;
*****: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:#F0FFFF;
background-image: url('altaer/color_bg.gif');
****-align:center;
}
.white
{
margin: 0px 0px 0px 0px;
*****: 48;
border: 1px 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:#F0FFFF;
background-image: url('altaer/color_bg.gif');
****-align:center;
}




.red
{
margin: 0px 0px 0px 0px;
*****: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:#FFFFFF;
background-image: url('images/b10c9bcaa6.gif');
****-align:center;
}

.green
{
margin: 0px 0px 0px 0px;
*****: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('images/b10c9bcaa6.gif');
****-align:center;
}

.blue
{
margin: 0px 0px 0px 0px;
*****: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:#FFFFFF;
background-image: url('images/b10c9bcaa6.gif');
****-align:center;
}
.gray
{
margin: 0px 0px 0px 0px;
*****: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('images/b10c9bcaa6.gif');
****-align:center;
}
.fushia
{
margin: 0px 0px 0px 0px;
*****: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:#FFFFFF;
background-image: url('images/b10c9bcaa6.gif');
****-align:center;
}

.teal
{
margin: 0px 0px 0px 0px;
*****: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:#FFFFFF;
background-image: url('images/b10c9bcaa6.gif');
****-align:center;
}

.brown
{
margin: 0px 0px 0px 0px;
*****: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('images/b10c9bcaa6.gif');
****-align:center;
}
.pink
{
margin: 0px 0px 0px 0px;
*****: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('images/b10c9bcaa6.gif');
****-align:center;
}
.black
{
margin: 0px 0px 0px 0px;
*****: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('images/b10c9bcaa6.gif');
****-align:center;
}

بعدين نذهب الى مجموعات الاعضاء

وندخل الى مجموعة الادارة

نضع بالمربع الايسر هاكود

رمز PHP:

" readonly style="*****: 90">

والمربع الايمن

<div style="margin:20px; margin-top:5px"> رمز PHP:
<div class="alt2"> <div dir="ltr" style="****-align:left;"> <span style="color: #000000"><span style="color: #007700">