الدرس 10
الجداول و تنظيم المعلومات
لو عاوز تعرض اسم كل ملف ونوعه ووظيفته الجدول هيخلي المعلومات واضحة جنب بعض
ال Table معناها جدول وال Column معناها عمود وال Row معناها صف
الجداول مدعومة في معاينة VS Code وفي GitHub Flavored Markdown واختصارها GFM
وهي نسخة Markdown اللي بيستخدمها GitHub مع إضافاته
جدول فيه 3 أعمدة
كمل في practice.md وسيب سطر فاضي قبل الجدول واكتب المثال ده
| File | Type | Purpose |
| --- | --- | --- |
| index.html | HTML | Page Structure |
| style.css | CSS | Page Styling |
| main.js | JavaScript | Page Interaction |السطر الأول أسماء الأعمدة File للملف و Type لنوعه و Purpose لوظيفته
السطر التاني فيه 3 شرطات لكل عمود وبيفصل عناوين الأعمدة عن البيانات
كل سطر بعده صف جديد وفي المعاينة هتشوف 3 أعمدة و 3 صفوف بيانات
العلامة | اسمها Pipe وبتفصل بين الخلايا خلي كل صف فيه نفس عدد الأعمدة
الكلام في النص Center
ال Center معناها في المنتصف علشان نوسط الكلام في عمود Type
حط علامة : قبل الشرطات وبعدها في العمود ده
| File | Type | Purpose |
| --- | :---: | --- |
| index.html | HTML | Page Structure |
| style.css | CSS | Page Styling |
| main.js | JavaScript | Page Interaction |في المعاينة عنوان Type ومحتوى العمود تحته هيبقوا في النص وباقي الأعمدة زي ما هي
التغيير كله في سطر الشرطات والعلامة :---: بتطبق المحاذاة على العمود كله
الكلام ناحية اليمين Right
ال Right معناها يمين علشان نخلي محتوى عمود Purpose ناحية اليمين حط علامة : بعد الشرطات فقط
هنسيب عمود Type في النص علشان نشوف الفرق بينهم
| File | Type | Purpose |
| --- | :---: | ---: |
| index.html | HTML | Page Structure |
| style.css | CSS | Page Styling |
| main.js | JavaScript | Page Interaction |
في المعاينة عمود Type في النص وعمود Purpose ناحية اليمين
لو عاوز تحدد ناحية الشمال بوضوح استخدم :--- يعني علامة : قبل الشرطات فقط