اضافة جدول مباريات اليوم بشكل يدوي

السلام عليكم وبعد طول الغياب الذي دام أكثر من شهر و الحمد الله أعود اليكم اليوم مع اضافة رائعة ويعشقها كل شخص يمتلك مدونة رياضية أو اي شخص يحب الاطلاع دائما علي جديد المباريات وهي اضافة جدول مباريات اليوم بشكل يدوي أي أن الاضافة لاتعمل بشكل تلقائي يجب علي كل شخص يضيف هذه الاضافة أن يعدل عليها ويمكنكم معاينتها عبر زر المعاينة التالي

معاينة

طريقة تركيب جدول المباريات

ابحث عن الوسم ]]></b:skin>

و اضف الكود التالي فوقه

.fbmatch {
list-style: outside none none;
margin: 10px auto;
padding: 0;
}
.fbmatch li {margin-bottom: 10px; border:0;}
.fbmatch li p {
background-color: #cc0000;
color: #fff;
direction: ltr;
display: block;
font: normal 13px/20px tahoma;
height: 20px;
margin: 0 auto;
text-align: center;
padding: 5px;
}
.inmathch {
background-color: #3c9bce;
height: 40px;
overflow: hidden;
}
.inmathch div {width: 125px;}
.fbmatch li img {
background-color: #fff;
border: 1px solid #ddd;
height: 34px;
padding: 2px;
width: 34px;
}
.firsteam,.firsteam img {float: right;}
.secondteam,.secondteam img {float: left;}
.inmathch h6 {
color: #fff;
display: inline-block;
font: bold 13px/40px droid arabic naskh;
padding: 0;
}
.firsteam h6 {margin:0 5px 0 0; float:right;}
.secondteam h6 {margin:0 0 0 5px; float:left;}
.fbmatch span {
background-color: #000;
color: #fff;
display: inline-block;
font: bold 18px/40px arial;
margin: 0 auto;
text-align: center;
width: 40px;
}

 بعد اضافة الكود السابق في المكان المحدد ننتقل للخطوة الثانية 

وهي اضافة الكود التالي في آداة HTML/JavaScript

 

<ul class="fbmatch">
<!--كود مباراة-->
<li>
<p>22/2/2016 - 7:35 م</p>
<div class="inmathch">
<div class="firsteam">
<img src="http://store2.up-00.com/2016-02/145583011592.png" />
<h6>ريال مدريد</h6>
</div>
<span class="natega">3-2</span>
<div class="secondteam">
<img src="http://store2.up-00.com/2016-02/145583011578731.png"/>
<h6>روما</h6>
</div>
</div>
</li>
</ul> 

يمكنكم اضافة أكثر من مبارات وذلك بتكرار الكود أعلي

شارك المقالة عبر:

إقرأ أيضا