مربعات
المجموعات بشكل رائع ومتحرك
خطوات التركيب
لوحة التحكم > ضبط الستايلات > اختيار الستايل الذي تريد التعديل عليه > تعريف CSS إضافي
تضيف في آخره
الكود :
| كود |
}
.red
{
margin: 0px 0px 0px 0px;
width:48;
border: 2px solid #EFC6B1 url(http://www.hijrahteam.com/vb/new/boodi.gif) repeat-x top left;
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:#FFB5D1;
background-image: url('http://www.hijrahteam.com/vb/new/b9.gif');
text-align:center;
}
.green
{
margin: 0px 0px 0px 0px;
width:48;
border: 2px solid #EFC6B1 url(http://www.hijrahteam.com/vb/new/boodi.gif) repeat-x top left;
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:#FFB5D1;
background-image: url('http://www.hijrahteam.com/vb/new/b1.gif');
text-align:center;
}
.blue
{
margin: 0px 0px 0px 0px;
width:48;
border: 2px solid #EFC6B1 url(http://www.hijrahteam.com/vb/new/boodi.gif) repeat-x top left;
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:#FFB5D1;
background-image: url('http://www.hijrahteam.com/vb/new/b2.gif');
text-align:center;
}
.gray
{
margin: 0px 0px 0px 0px;
width:48;
border: 2px solid #EFC6B1 url(http://www.hijrahteam.com/vb/new/boodi.gif) repeat-x top left;
cursor: pointer;
font-family:MS Sans Serif;
font-size:10px;
vertical-align:middle;
letter-spacing:0;
color:#F1D192;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#FFB5D1;
background-image: url('http://www.hijrahteam.com/vb/new/b4.gif');
text-align:center;
}
.fushia
{
margin: 0px 0px 0px 0px;
width:48;
border: 2px solid #EFC6B1 url(http://www.hijrahteam.com/vb/new/boodi.gif) repeat-x top left;
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:#FFB5D1;
background-image: url('http://www.hijrahteam.com/vb/new/b3.gif');
text-align:center;
}
.orang
{
margin: 0px 0px 0px 0px;
width: 48;
border: 2px solid #EFC6B1 url(http://www.hijrahteam.com/vb/new/boodi.gif) repeat-x top left;
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:#FFB5D1;
background-image: url('http://www.hijrahteam.com/vb/new/b4.gif');
text-align:center
}
.teal
{
margin: 0px 0px 0px 0px;
width: 48;
border: 2px solid #EFC6B1 url(http://www.hijrahteam.com/vb/new/boodi.gif) repeat-x top left;
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:#FFB5D1;
background-image: url('http://www.hijrahteam.com/vb/new/b00.gif');
text-align:center;
}
.brown
{
margin: 0px 0px 0px 0px;
width: 48;
border: 2px solid #EFC6B1 url(http://www.hijrahteam.com/vb/new/boodi.gif) repeat-x top left;
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:#FFB5D1;
background-image: url('http://www.hijrahteam.com/vb/new/b00.gif');
text-align:center;
}
.pink
{
margin: 0px 0px 0px 0px;
width: 48;
border: 2px solid #EFC6B1 url(http://www.hijrahteam.com/vb/new/boodi.gif) repeat-x top left;
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:#FFB5D1;
background-image: url('http://www.hijrahteam.com/vb/new/b3.gif');
text-align:center;
}
.black
{
margin: 0px 0px 0px 0px;
width: 48;
border: 2px solid #EFC6B1 url(http://www.hijrahteam.com/vb/new/boodi.gif) repeat-x top left;
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:#FFB5D1;
background-image: url('http://www.hijrahteam.com/vb/new/b8.gif');
text-align:center;
}
.white
{
margin: 0px 0px 0px 0px;
width: 48;
border: 2px solid #EFC6B1 url(http://www.hijrahteam.com/vb/new/boodi.gif) repeat-x top left;
cursor: pointer;
font-family:MS Sans Serif;
font-size:10px;
vertical-align:middle;
letter-spacing:0;
color:#FFF2DA;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#FFB5D1;
background-image: url('http://www.hijrahteam.com/vb/new/b00.gif');
text-align:center;
}
.Divine
{
margin: 0px 0px 0px 0px;
width:48;
border: 2px solid #EFC6B1 url(http://www.hijrahteam.com/vb/new/boodi.gif) repeat-x top left;
cursor: pointer;
font-family:MS Sans Serif;
font-size:10px;
vertical-align:middle;
letter-spacing:0;
color:#2CC8EA;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#FFB5D1;
background-image: url('http://www.hijrahteam.com/vb/new/b20.gif');
text-align:center;
}
.Badngan
{
margin: 0px 0px 0px 0px;
width:48;
border: 2px solid #EFC6B1 url(http://www.hijrahteam.com/vb/new/boodi.gif) repeat-x top left;
cursor: pointer;
font-family:MS Sans Serif;
font-size:10px;
vertical-align:middle;
letter-spacing:0;
color:#7026AE;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#FFB5D1;
background-image: url('http://www.hijrahteam.com/vb/new/b22.gif');
text-align:center;
}
.wodi
{
margin: 0px 0px 0px 0px;
width:48;
border: 2px solid #EFC6B1 url(http://www.hijrahteam.com/vb/new/boodi.gif) repeat-x top left;
cursor: pointer;
font-family:MS Sans Serif;
font-size:10px;
vertical-align:middle;
letter-spacing:0;
color:#660106;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#FFB5D1;
background-image: url('http://www.hijrahteam.com/vb/new/b21.gif');
text-align:center;
}
.red
{
margin: 0px 0px 0px 0px;
width:48;
border: 2px solid #EFC6B1 url(http://www.hijrahteam.com/vb/new/boodi.gif) repeat-x top left;
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:#FFB5D1;
background-image: url('http://www.hijrahteam.com/vb/new/b9.gif');
text-align:center;
}
.greeen
{
margin: 0px 0px 0px 0px;
width:48;
border: 2px solid #EFC6B1 url(http://www.hijrahteam.com/vb/new/boodi.gif) repeat-x top left;
cursor: pointer;
font-family:MS Sans Serif;
font-size:10px;
vertical-align:middle;
letter-spacing:0;
color:#99cc66;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#FFB5D1;
background-image: url('http://www.hijrahteam.com/vb/new/b1.gif');
text-align:center;
}
|
ومن ثم نذهب الى ضبط اعدادات مجموعه الاعضاء
وتروح للمجموعه اللي تبي تلونها
الصف الرابع فيه مربعين المربع اللي عاليسار نحط فيه
| كود |
" readonly style="width: 90">
|
واللي عاليمين
| كود |
<input type="text" name="T1" size="17" class="red" value="
|
مع امكانيه تغيير اللون red بأحد الالوان الموجوده في الاعلى
اتمنى يكون الشرح واضح
| 
|
17-02-2009, 14:08
مربعات المجموعات بشكل رائع ومتحرك
المواضيع المتشابهه
العرض العادي
