يوفر HTML (HyperText Markup Language) ستة علامات خاصة لعرض عناوين من مستويات مختلفة. تحتوي جميعها على معلمات افتراضية (حجم الخط ونمطه ، ومقدار المسافات البادئة من العناصر السابقة والتالية ، وما إلى ذلك). يمكن تجاوز هذه الخيارات باستخدام تعليمات CSS (Cascading Style Sheets) وبالتالي تغيير مظهر العناوين في نص صفحة الويب.
تعليمات
الخطوة 1
ضع عناوين المستويات المختلفة بين علامات الفتح والختام المقابلة ، إذا لم يكن قد تم ذلك بالفعل في الكود المصدري لصفحة الويب. على سبيل المثال ، يجب أن يكون العنوان الأكثر أهمية (المستوى الأول) بين العلامات
و
:
عنوان المستوى الأول
يجب وضع العنوان الفرعي التالي الأكثر أهمية بين العلامات
و
إلخ. آخر المستويات المتوقعة هو السادس -
و
الخطوة 2
ضع في الجزء العلوي من شفرة المصدر (بين العلامات والعلامات) بيانًا يخبر متصفح الزائر بوجود وصف للأنماط في CSS في هذا المكان:
/ * تعليمات CSS ستكون هنا * /
الخطوه 3
بين علامات نمط الفتح والإغلاق ، أضف أوصاف نمط لعناوين كل مستوى تريد تغيير مظهره. على سبيل المثال ، إذا كنت تحتاج فقط إلى تغيير مظهر عناوين المستوى الأول ، فقد يبدو هذا الرمز كما يلي:
h1 {
لون احمر؛
حجم الخط: 20 بكسل ؛
نمط الخط: مائل ؛
وزن الخط: عريض ؛
أعلى الهامش: 30 بكسل ؛
الهامش السفلي: 20 بكسل ؛
}
هنا ، يشير h1 إلى أن الوصف في الأقواس المتعرجة يشير إلى علامة h1 ويسمى "محدد". تحدد معلمة اللون لون النص ، ومعلمة حجم الخط هي حجم الخط ، ونمط الخط مع القيمة المائلة هو الخط المائل ، ويكون وزن الخط مع القيمة الغامقة غامقًا ، ويكون الهامش العلوي هو الأعلى الهامش ، والهامش السفلي هو الهامش السفلي. لعناوين المستوى الثاني ، أضف كتلة مماثلة بمحدد h2 ، إلخ.
الخطوة 4
استخدم صيغة الاختزال إذا كان هناك العديد من المستويات المراد وصفها. على سبيل المثال ، يمكن وضع أوصاف الخط في معلمة واحدة ، بالإضافة إلى أوصاف أحجام المسافة البادئة. عينة:
h1 {
لون احمر؛
الخط: غامق 20 بكسل arial ؛
الهامش: 30 بكسل 0 20 بكسل 0 ؛
}
h2 {
اللون برتقالي؛
الخط: خط عريض 18 بكسل ؛
الهامش: 25 بكسل 0 15 بكسل 0 ؛
}
في معلمة الهامش ، يجب تحديد الهوامش في اتجاه عقارب الساعة ، بدءًا من الهامش العلوي مرورًا بمسافة (أعلى اليمين أسفل اليسار).
