العناوين هي عنصر مهم في أي صفحة ، والتي تستخدم عادة لتسليط الضوء على التسلسل الهرمي للمعلومات. لإنشاء تصميم فعال وتحسين قابلية قراءة النص ، من المهم جدا ضبط نمط العناوين بشكل صحيح. ستتيح لك قائمة أنماط الرأس هذه معرفة كيفية تغيير الحجم والخط ونمط الخط للرؤوس في صفحات الويب الخاصة بك.
تتمثل إحدى طرق تغيير نمط الرؤوس في تغيير حجمها. يمكن تحديد حجم الرؤوس باستخدام قيم وحدات القياس المطلقة أو النسبية ، مثل وحدات البكسل أو النسب المئوية. يمكن استخدام حجم رأس أصغر للأقسام الصغيرة أو الأقسام الفرعية ، بينما تستخدم الرؤوس الأكبر عادة للأقسام والفصول الأكبر. سيساعد استخدام أحجام رأس مختلفة القارئ على التنقل في الصفحة بشكل أفضل وتجنب الالتباس.
يعد تعيين خط العناوين أيضا جانبا مهما. يمكنك اختيار خطوط مختلفة لعناوينك لإنشاء نمط فريد وإبراز رسالتك. الخطوط الشعبية للعناوين هي أريال ، تايمز نيو رومان ، فيردانا وغيرها. يمكنك أيضا جعل العناوين جريئة أو مائلة للفت الانتباه إليها وجعل النص أكثر تعبيرا.
بالطبع ، من المهم أن يكون لديك نمط ثابت من العناوين في جميع أنحاء الصفحة. للقيام بذلك ، يمكنك استخدام أوراق أنماط كس لتغيير الحجم والخط والمخطط التفصيلي للعناوين في نفس الوقت. ستخلق هذه الوحدة انطباعا عن الاحتراف والتفكير التصميمي. استخدم هذه الإرشادات لتخصيص نمط الرأس وإنشاء صفحات ويب جيدة التصميم.
- حجم الرأس
- تحديد الحجم باستخدام علامات هتمل
- باستخدام كس لتعيين حجم
- الخط من العناوين
- اختيار الخط المناسب للعناوين
- أمثلة على استخدام خطوط مختلفة
حجم الرأس
يمكن أن تكون رؤوس هتمل بأحجام مختلفة ، مما يعكس أهمية ومستوى الرأس على صفحة الويب. هناك ستة مستويات من الرؤوس ، من ح1 إلى ح6.
رأس ح1 هو الأكبر والأكثر أهمية ، في حين أن رأس ح6 هو الأصغر والأقل أهمية.
في أغلب الأحيان ، يتم استخدام العناوين للإشارة إلى الأقسام والأقسام الفرعية للصفحة ، مما يمنح المستخدم فكرة عامة عن المحتوى.
أمثلة التعليمات البرمجية للرؤوس:
هذا هو ح1 رأس
هذا هو ح2 رأس
هذا هو رأس ح3
هذا هو رأس ح4
هذا هو رأس ح5
هذا هو ح 6 رأس
كل مستوى رأس له أنماطه الخاصة المحددة في كس. بشكل افتراضي ، يكون خط العناوين أكبر وجريئا لتمييزها على الصفحة. ومع ذلك ، يمكن تغيير نمط الرأس باستخدام كس.
تحديد الحجم باستخدام علامات هتمل
| الوسم | الحجم |
|---|---|
| أكبر |
| كبير |
| متوسطة |
| صغير |
| حتى أقل |
| الأصغر |
يمكن استخدام هذه العلامات لإنشاء رؤوس بأحجام مختلفة على صفحة ويب. على سبيل المثال:
وهذا رأس متوسط الحجم
متوسط حجم النص
سمة النمط
لضبط حجم النص. على سبيل المثال:
حجم نص كبيرمتوسط حجم النص
حجم نص صغيركل هذه الطرق تسمح لك بتعديل حجم النص بمرونة في هتمل ، اعتمادا على احتياجات ومهام مطور الويب.
باستخدام كس لتعيين حجمفي أوراق الأنماط المتتالية (كس) ، هناك عدة طرق لتعيين حجم النص في عناصر هتمل ، بما في ذلك الرؤوس. يتم ذلك باستخدام خاصية حجم الخط.
تحدد خاصية حجم الخط حجم الخط بالبكسل أو النسب المئوية أو م أو وحدات القياس الأخرى. فيما يلي أمثلة على استخدام هذه الخاصية لتعيين حجم الرؤوس:
ح1 {حجم الخط: 36 بكسل؛}يحدد هذا الرمز حجم الخط لـ ح1 العنصر إلى 36 بكسل.ح2 {حجم الخط: 24 بكسل؛}يحدد هذا الرمز حجم الخط لـ ح2 العنصر إلى 24 بكسل.ح3 {حجم الخط: 18 بكسل؛}يحدد هذا الرمز حجم الخط لـ ح3 العنصر إلى 18 بكسل.
ح4 {حجم الخط: 16 بكسل؛}
يحدد هذا الرمز حجم الخط لـ ح4 العنصر إلى 16 بكسل.
ح5 {حجم الخط: 14 بكسل؛}
- ح6 {حجم الخط: 12 بكسل؛}
- بالإضافة إلى وحدات البكسل ، يمكن تعيين حجم الخط في وحدات قياس أخرى ، مثل النسب المئوية أو م. على سبيل المثال:
- ح2 {حجم الخط: 150٪؛}
- ح4 {حجم الخط: 100٪؛}
ح5 {حجم الخط: 80٪؛}
الخط من العناوين
حجم الخط
: يحدد حجم الخط من العناوين;
الخط الوزن
: يحدد خط العناوين ، على سبيل المثال ، غامق أو عادي;
ارتفاع الخط
: يحدد تباعد الأسطر داخل الرؤوس.
مثال على استخدام كس لتعيين خط العناوين:
ح1 {
الخط الأسرة: أريال ، بلا الرقيق;
حجم الخط: 24 بكسل;
| وزن الخط: غامق; | خط الارتفاع: 1.5; |
|---|---|
| } | ح2 { |
| الخط الأسرة: فيردانا ، بلا الرقيق; | حجم الخط: 20 بكسل; |
| الخط الوزن: عادي; | ارتفاع الخط: 1.5; |
| } | ح3 { |
الخط-الأسرة: تاهوما ، بلا الرقيق;