كيفية اضافة القوائم في صفحة الويب بلغة html
السلام عليكم ورحمة الله وبركاته
سنتعرف في هذا الدرس علي كيفية اضافة القوائم في صفحة الويب بلغة html.
يوجد اكثر من نوع من القوائم منها القوائم المرتبة والقوائم غير المرتبة وتستخدم هذه القوائم علي صفحات الويب فإنها تقوم بتنظيم المحتوي الخاص بك وفيما يلي سنتعرف علي هذه القوائم وشفراتها واكوادها.
كود اضافة القوائم غير المرتبة في صفحة الويب بلغة html
<body dir="rtl"><ul><li> موقع المقدم </li><li> موقع المقدم لتعلم البرمجة</li><li> اهلا بكم </li></ul></body>
نلاحظ من هذا الكود السابق:
1. القوائم غير المرتبة Unordered list: نرمز لها بالوسم <ul>.
2. لكي نضيف محتوي داخلها list item نضيف العنصر <li> والذي يستخدم لكتابة النص الذي نريد ترتيبه كما في الصوره الظاهرة.
3. كما لاحظنا ايضاً ان وسم القوائم <ul> ينشأ بين وسمين البدايه والنهاية <body>.
 |
| الصورة الظاهرة |
كود اضافة القوائم المرتبة في صفحة الويب بلغة html
<body dir="rtl"><ol><li> موقع المقدم </li><li> موقع المقدم لتعلم البرمجة</li><li> اهلا بكم </li></ol></body>
نلاحظ من هذا الكود السابق:
1. عنصر القوائم المرتبة Ordered list ينشئ باستخدام الوسم <ol>
2. لكي نضيف محتوي داخل القوائم المرتبة نستخدم الوسم <li> ايضاً كما في القوائم غير المرتبة.
3. شاهد الصورة الظاهرة.
 |
| الصورة الظاهرة |
ملاحظة بسيطة:-
يمكنك تغيير شكل القوائم غير المرتبة الي شكل دوائر Circle ومربعات square وقرص disc لاحظ هذا الكود الآتي:
<body dir="rtl"><ul type="square"><li> موقع المقدم </li><li> موقع المقدم لتعلم البرمجة</li><li> اهلا بكم </li></ul></body>
نلاحظ من هذا الكود السابق:
1. قمنا بأضافة الواصفة type وأضفنا بداخلها القيمة square التي تستخدم لجعل شكل القوائم مربعة كما فى الصوره الظاهرة
 |
| الصوره الظاهرة |
وفي نهاية هذا الدرس نرجو ان نكون قد افدناكم حتي لو بالقليل وشكراً.
تعلمنا في هذا الدرس
كيفية اضافة القوائم في صفحة الويب بلغة html, كيفية اضافة القوائم المرتبة في صفحة الويب html, كيفية اضافة القوائم غير المرتبة في صفحة الويب بلغة html.
الدروس السابقة:
تعليقات
إرسال تعليق