الأقسام الرئيسية
ابحث فى المدونة
المواضيع الاكثر مشاهده
أحدث المواضيع
تعلم و احترف HTML فى 14 يوم
اليوم الرابع
الفقرات و القوائم
و كذلك لتوسيط الفقرات يستخدم الوسم center:
<center>.................</center>
<OL>
<LI>احمد
<LI>محمد
<LI>على
<LI>ابراهيم
<LI>مصطفى
</OL>
و الخاصية الوحيدة التى تستخدم مع القوائم هى TYPE و ذلك لتحديد شكل الترقيم او الشكل الظاهر بجانب البنود .
وفى القوائم المتسلسلة تأخذ القيم A,a,I,i
اما فى القوائم غير المتسلسلة فتأخذ القيم Square , circle و تكتب كالاتى :
Hyper Text Markup Language
WWW
World Wide Web
FTP
File Transfer Protocol
CSS
Cascading Style Sheets
</DL>
قولنا فى اليوم السابق سنتحدث اليوم عن الفقرات والقوائم .
تتذكر فى اليوم الاول حينما ذكرت ان الوسم <p> يستخدم لانهاء الفقرة و هذا الوسم له اهمية كبيرة حيث يحدد بداية الفقرات و اتجاه النص فيها .
خواصه:
تستخدم الخاصيةALIGN لتحديد محاذاة الفقرة و تأخذ القيم Right , Left , Center كالاتى :
تتذكر فى اليوم الاول حينما ذكرت ان الوسم <p> يستخدم لانهاء الفقرة و هذا الوسم له اهمية كبيرة حيث يحدد بداية الفقرات و اتجاه النص فيها .
خواصه:
تستخدم الخاصيةALIGN لتحديد محاذاة الفقرة و تأخذ القيم Right , Left , Center كالاتى :
<p align="left">
This is a left aligned paragraph
</p>
<p align="right">
This is a right aligned paragraph
<p align="right">
This is a right aligned paragraph
</p>
<p align="center">
This is a center aligned paragraph
</p>
<center>.................</center>
اما الخاصية الثانية وهى DIR و تأخذ القيم :
*LTR (Left To Right) اتجاه النص من اليسار الى اليمين كالانجليزية
*RTL(Right To Left) اتجاه النص من اليمين الى اليسار كالعربية
وهذه الخاصية مهمة عند كتابة الصفحات باللغة العربية .
ولتنسيق الفقرات ايضا يوجد الوسم Blockquote اى الفقرات المقتبسة .
<blockquote>.................</blockquote>
ووظيفتها تمييز الفقرة وذلك باضافة هوامش على يمين و يسار الفقرة .
و تستطيع ادراج اكثر من هامش للفقرة (جرب بنفسك)
<blockquote>
<blockquote>
........text here.........
</blockquote>
</blockquote>
و ليس شرطا استخدامها مع الفقرات المقتبسة بل يمكن تستخدم لاضافة تنسيق عام للصفحة لعمل الهوامش .
* الوسم الاخير و هو (PRE (preformated
<pre>............</pre>
لنكتشف ماذا يفعل هذا الوسم فى صفحتك اكتب الوسم السابق و اكتب اى جملة مكان النقط . ماذا وجدت ؟
هل استطعت تفسير ما حدث ؟ نعم الوسم PRE يحول الخطوط الى خطوط موحدة المسافات .
القوائم
تحتوى لغة HTML على وسوم خاصة بتنظيم البيانات و وضعها فى قوائم و باستخدام عدة خيارات و هناك نوعين من القوائم :
*القائمة المتسلسلة Ordered Lists
كالمثال التالى :
1.احمد
2.محمد
3. على
4. ابراهيم
5.مصطفى
*القائمة غير المتسلسلة Unordered Lists
كالمثال التالى:
تحتوى لغة HTML على وسوم خاصة بتنظيم البيانات و وضعها فى قوائم و باستخدام عدة خيارات و هناك نوعين من القوائم :
*القائمة المتسلسلة Ordered Lists
كالمثال التالى :
1.احمد
2.محمد
3. على
4. ابراهيم
5.مصطفى
*القائمة غير المتسلسلة Unordered Lists
كالمثال التالى:
- احمد
- محمد
- على
- ابراهيم
- مصطفى
بالنسبة للقوائم المتسلسلة نستخدم الوسوم
<OL>.............</OL>
اما القوائم غير المتسلسلة نستخدم
<UL>............</UL>
و لتعيين كل بند من بنود القائمة نستخدم الوسم <LI> و هو وسم منفرد يكتب فى بداية السطر الخاص بكل بند List Item.
اذا لكى نكتب القوائم السابقة بنفس الشكل والترتيب نكتب الاتى :
<OL>
<LI>احمد
<LI>محمد
<LI>على
<LI>ابراهيم
<LI>مصطفى
</OL>
والشكل الثانى
<UL>
<LI>احمد
<LI>محمد
<LI>على
<LI>ابراهيم
<LI>مصطفى
</UL>
و الخاصية الوحيدة التى تستخدم مع القوائم هى TYPE و ذلك لتحديد شكل الترقيم او الشكل الظاهر بجانب البنود .
وفى القوائم المتسلسلة تأخذ القيم A,a,I,i
اما فى القوائم غير المتسلسلة فتأخذ القيم Square , circle و تكتب كالاتى :
<ul type="square">
<ul type="circle">
و هناك وسوم اخرى تستخدم لانشاء القوائم غير المتسلسلة و هى
<DIR>...........</DIR>
<MENU>............</MENU>
و هناك نوع خاص من القوائم يدعى قوائم الشرح او التعريف Definition List وهى عبارة عن قائمة من المصطلحات يتبع كل واحد منها شرح او تعليق .
HTMLHyper Text Markup Language
WWW
World Wide Web
FTP
File Transfer Protocol
CSS
Cascading Style Sheets
و نحتاج لانشاء هذه القائمة الى 3 وسوم:
1-<DL>.........</DL>
لتعريف بداية و نهاية القائمة .
2-<DT>
و هو وسم منفرد و يوضع قبل كل مصطلح لتحديده.
3-<DD>
ايضا وسم منفرد ويسمى وسم الشرح او التعليق.
لنقم الان بكتابة القائمة السابقة
<DL>
<DT>HTML
<DD>Hyper Text Markup Language
<DT>WWW
<DD>World Wide Web
<DT>FTP
<DD>File Transfer Protocol
<DT>CSS
<DD>Cascading Style Sheets </DL>
و هكذا نكون انتهينا من الفقرات و القوائم و موعدنا فى اليوم التالى للحديث عن الصور و الرسومات .
Labels:
هندسة الاتصالات
الاشتراك في:
تعليقات الرسالة (Atom)
1 comments:
خدمات عجمان – المحترف للصيانة – الامارات
صيانة مكيفات عجمان
تركيب ستلايت عجمان
إرسال تعليق
ضع تعليقك أو أستفسارك