الدرس التاسع : الجداول و تنسيقها ( 1 )

الوليد الراشدي · #1 (**permalink**) 23-08-2008, 05:38 PM

الدرس التاسع : الجداول و تنسيقها (1)

شباب تكفون ركزوا عندي
الجداول أصعب شي لكنها مفيده واجد بالاخص لما تسوي ستايل لمنتدى أو مجله ..
تابعوا عندي خطوه خطوه عشان تفهموا زين ..
أولاً : الاوامر الاساسيه لادراج جدول
شوفوا هالشفره ..

كود PHP:

  <html> 
<head> 
<title> الجداول </title> 
</head> 
<body> 
<table> 
<tr> 
<td> خليه </td> <td> خليه </td>
</tr> 
<tr> 
<td> خليه </td> <td> خليه </td> 
</tr> 
</table> 
</body> 
</html>

وعند نسخ الشفره الى المفكره و من ثم استعراضها في المستعرض .. تكون النتيجه كذا :

شرح الشفره ..
شوفوا في ثلاث أوامر أساسيه عند وضع أي جدول الي هي ..

كود PHP:

  <table>

= الامر الاساسي في ادراج الجداول و تندرج تحته باقي الاوامر

كود PHP:

  <tr>

= أمر اضافة عمود و تندرج تحته أوامر الصفوف و الخلايا

كود PHP:

  <td>

= امر اضافة الصف أو الخليه

ثانياً : الخصائص التي تستخدم في تنسيق (( الجدول ))
و راح نعددها واحد واحد و بعدين راح أعطيكم مثال يوضحها كلها ان شاء الله ,,

1/ الخاصية border
و هي لاضافة حدود للجدول .. و نستخدمها على هذا الشكل ..

كود PHP:

  <table border="x">

طبعا مع تغيير المتغير x الى الرقم الذي يمثل حجم الحدود الذي تريدها للجدول ..
و هذا يعني أن حجم الحد سيكون 4 .. ولكن اذا كنا نريد نحط ما فيه حد شو نسوي ؟؟ الجواب : نحط بدل x الرقم 0

2/ خاصية العرض width
و تستخدم كالتالي :

كود PHP:

  <table width="xxx">

و ممكن نغير الــ xxx الى حاجتين ..
الاولى :متغير يكون رقم كالتالي :

كود PHP:

  <table width="400">

الثانيه : متغير يكون نسبه مئويه ..
<table width="75%">

2/ خاصية الارتفاع height
حالها حال خاصية العرض ممكن بالنسبه المئويه و ممكن بالارقام ..
ملاحظه : جميع القياسات التي تضعها في كل من خاصية الطول و العرض و الارتفاع و غيرها بالبكسل و ليست بالسنتي متر ..
نرجع لخاصيتنا ..
لاحظ كيف نكتبها ..

كود PHP:

  <table height="100">

او

كود PHP:

  <table height="20%">

الحين اخر حاجه ..
تطبيق عملي على كل الي قلناه اليوم ..

كود PHP:

  <html> 
<head> 
<title> الجداول </title> 
</head> 
<body> 
<table border="3" width="300" height="75%"> 
<tr> 
<td> خليه </td> <td> خليه </td>
</tr> 
<tr> 
<td> خليه </td> <td> خليه </td> 
</tr> 
</table> 
</body> 
</html>

و مثل ما تعودنا لازم تكون نتيجة الكود بعد نسخه الى المفكره و تغيير امتداده و تشغيله بالمستعرض مثل ما موضح فالصوره ..

لم ننتهي من الجداول الا و هذي البدايه بس ..
يـــــــــــــــــتــــ الجداول ــــــــــــــبـــ و تنسيقها (2) ــــــــــــــــع

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

تحياتي : الوليد الراشدي

الدرس التاسع : الجداول و تنسيقها ( 1 )

دورة تعلم لغة الـ HTML