بعد ان تحدثنا عن الجداول وكيفية انشاءها سنأخذ بعض الدروس الاضافية وسنبدء بكيفية التحكم بكل خلية وكل صف على حده من حيث الخلفية والعرض والارتفاع حيث سنستخدم نفس الخصائص التي استخدمناها في التحكم بخصائص الجدول لنستخدمها على الخلايا والصفوف وهي كالتالي :
bgcolor : للتحكم بلون خلفية الخلية او الصف
background : لضبط صورة كخلفية للخلية او الصف
width : عرض الخلية او الصف
height : ارتفاع الخلية او الصف
مثال تطبيقي
سننشئ جدول بثلاث صفوف في كل صف ثلاث خلايا وسنضبط الصف الاول بخلفية زرقاء والصف الثاني ذو خلفية خضراء والصف الثالث ذو خلفية صفراء وسيكون الوسم بالشكل التالي :
<html dir="rtl">
<head><title>موقع التقنية اليوم </title></head>
<body>
<table border="2" cellpadding="10">
<tr bgcolor=#2aa2ff ><td>خلية في الصف الاول</td><td>خلية في الصف الاول</td><td> خلية في الصف الاول</td></tr>
<tr bgcolor=#98f7b1 ><td>خلية في الصف الثاني</td><td>خلية في الصف الثاني</td><td> خلية في الصف الثاني</td></tr>
<tr bgcolor=#fefdba ><td>خلية في الصف الثالث</td><td>خلية في الصف الثالث</td><td> خلية في الصف الثالث</td></tr>
</table>
</html>
والنتيجة ستكون :
هل لاحظت كيف قمت بتغيير لون الخلفية لكل صف , يمكنك ايضاً استخدام صورة كخلفية لكل صف على حده وكما يمكنك ايضا التحكم بعرض وارتفاع كل صف على حده ....... ماذا عن الخلايا فلنجرب بمثال ونغير الصف الاول بالمثال السابق بحيث نجعل كل خلية بلون حيث سنغير خلفية الخلية الاولى باللون البرتقال والثانية باللون المدادي والثالثة باللون البني وسيكون الوسم كالتالي :
<html dir="rtl">
<head><title>موقع التقنية اليوم </title></head>
<body>
<table border="2" cellpadding="10">
<tr ><td bgcolor=#fedfba>خلية في الصف الاول</td><td bgcolor=#babafe >خلية في الصف الاول</td><td bgcolor=#c49f7c> خلية في الصف الاول</td></tr>
<tr bgcolor=#98f7b1 ><td>خلية في الصف الثاني</td><td>خلية في الصف الثاني</td><td> خلية في الصف الثاني</td></tr>
<tr bgcolor=#fefdba ><td>خلية في الصف الثالث</td><td>خلية في الصف الثالث</td><td> خلية في الصف الثالث</td></tr>
</table>
</html>
وستكون النتيجة :
هل لاحظت الصف الاول كيف قمت بتغيير لون الخلفية لكل خلية الامر بسيط يمكنك ايضا استخدام باقي الخصائص كالعرض والارتفاع .
اترك تعليقك على الموضوع