العناوين:
وهي من ستة مستويات، العنوان الأول h1 والثاني h2 وهكذا حتى h6...
Heading 1Heading 2Heading 3Heading 4Heading 5Heading 6 |
<h1>Heading 1</h1> <h2>Heading 2</h2> <h3>Heading 3</h3> <h4>Heading 4</h4> <h5>Heading 5</h5> <h6>Heading 6</h6> |
الفقرات :
| لتحديد الفقرات يتم إحاطتها بالوسم P | <p>Paragraph Text</p> |
||||
| لتحديد اتجاه الفقرة استخدم الخاصية align في الوسم P |
<p align="left">Left aligned paragraph</p> <p align="center">Centered paragraph</p> <p align="right">Right aligned paragraph</p> |
||||
| لتحديد إتجاه قراءة النص استخدم الخاصية DIR |
|
القوائم:
تحتوي لغة HTML على مجموعة من الوسوم الخاصة بتنظيم البيانات في قوائم وباستخدام عدة خيارات. وهناك نوعين من القوائم:
| Ordered Lists <OL> ....</OL> القوائم المتسلسلة |
<UL> ... </UL> القوائم غير المتسلسلة Unordered Lists |
||||
|
|
يستخدم الوسم <LI> لتعيين كل بند من بنود القائمة وهو وسم مفرد يكتب في بداية السطر الخاص بكل بند List Item.
والخاصية الوحيدة التي تستخدم مع هذه الوسوم هي TYPE ووظيفتها تحديد شكل الرمز الظاهر مع بنود القائمة، وعادة تستخدم مع وسوم بداية القوائم <UL> أو <OL> وبذلك نحدد رمزاً واحداً لكل القائمة. ولكن نستطيع استخدامها أيضاً مع وسم البنود <LI> لإعطاء تحكم أكبر في مظهر القائمة من خلال تحديد رمز مختلف لكل بند. فعند وضعها ضمن تعريف القوائم المتسلسلة تأخذ القيم: A, a, I, i التي تغير رموز الترقيم من الأرقام العادية الإفتراضية (والتي رمزها 1) إلى ترقيم باستخدام الأحرف اللاتينية الكبيرة أو الصغيرة، أو باستخدام الأرقام الرومانية كما ترى في الجدول التالي:
| <OL TYPE="A"> | <OL TYPE="a"> | <OL TYPE="I"> | <OL TYPE="i"> |
الوصلات :
لعمل وصلة استخدم الوسم a مع الخاصية href لتحديد الوجهة، الوجهة قد تكون صفحة html وعندها يبدأ العنوان بـ http: وقد يكون عنوان موقع ftp وعندها يبدأ بـ ftp: وقد يكون بريدا إلكترونيا وعندها يبدأ بـ mailto: ،ستعرف المزيد عن المسارات عندما يأتي الحديث عن الصور في درسقادم، وبين وسمي الفتح والإغلاق ضع المحتويات، وهي قد تكون نصوصا أو صورا.
| <a href="http://www.microsoft.com/">Microsoft Corp.</a><br> <a href="mailto:عنوان البريد الإلكتروني هذا محمي من روبوتات السبام. يجب عليك تفعيل الجافاسكربت لرؤيته.">My E-mail</a> |
يوجد أيضا استخدام آخر للوسم a باستعمال الخاصية name بدلا من href (يمكن استعمال الإثنين معا)، وبعد ذلك تستطيع أن تدرج وصلة عادية تشير إلى المكان الذي به <a name="">، وذلك بجعل خاصية href الوصلة العادية تشير إلى الإسم المحدد في name مسبوقا بعلامة#.
مثال:
مثال:
| إذا أردت أن تضع وصلة تقودك إلى جزء معين من المستند الحالي، ستقوم بعمل في المكان المطلوب : | http://barmijha.isna3ha.com/all/Lweb/HTML/html5.htm); font-weight: 700;"><a name="myname"></a> |
| ثم تدرج وصلة في أي مكان آخر كالتالي: | <a href="#myname">إسمي</a> |
| ويمكنك أيضا عمل ذلك عبر المستندات (من مستند إلى مستند آخر) بحيث تحدد بالضبط المكان الذي تريده من المستند الوجهة هكذا |
<a href="/name.html#myname">إسم </a> |
يمكنك أيضا عمل وصلة إلى أعلى المستند بوضع #top في الخاصية href.
تمرين تطبيقي:
أنجز صفحة ويب تحتوي على مختلف الوسوم المكتوبة أعلاه مع ملاحظة الفروق عند تغير قيم هذه الوسوم.