يعد حجم الخط أحد العناصر المهمة لتصميم الويب ، والذي يمكن أن يكون له تأثير كبير على إدراك النص وسهولة قراءة المحتوى على صفحة الويب.
يوفر هتمل طرق مختلفة لتعيين حجم الخط على موقع على شبكة الانترنت. بفضل سمة النمط المرنة والمتعددة الوظائف ، يمكنك ضبط حجم النص حسب رغبتك.
لتحديد حجم الخط ، تحتاج إلى استخدام قيمة سمة حجم الخط. القيم الأكثر استخداما لحجم الخط هي بكسل (بكسل) ، إم و ريم. يظل حجم النص بالبكسل كما هو بغض النظر عن حجم إطار العرض ، بينما تسمح لك قيم إم وريم بتعيين أحجام خطوط نسبية.
على سبيل المثال ، لتعيين حجم الخط إلى 16 بكسل ، يمكنك استخدام قيمة حجم الخط: 16 بكسل؛. إذا كنت تريد تعيين حجم خط يمثل نصف حجم الخط الحالي للعنصر ، فيمكنك استخدام قيمة حجم الخط: 0.5 م؛.
باستخدام سمة النمط ، يمكنك تعيين حجم الخط داخل علامة معينة ، على سبيل المثال ، ص أو ديف ، لتغيير حجم الخط فقط داخل هذا العنصر.
- علامات الخط هتمل والسمات
- ضبط حجم النص في كس
- وحدات حجم الخط
- ضبط نمط النص واللون
- استخدام أحجام الخطوط النسبية
- حجم الخط التكيفي للأجهزة المختلفة
- استئناف
علامات الخط هتمل والسمات
لتعيين حجم الخط في هتمل ، يمكنك استخدام العلامة مع سمة الحجم. على سبيل المثال ، لتعيين حجم الخط إلى 12 بكسل ، تحتاج إلى استخدام التعليمات البرمجية التالية:
النص
يمكنك أيضا استخدام أحجام الخطوط النسبية عن طريق تحديد قيمة سمة الحجم كنسبة مئوية أو في القيم من 1 إلى 7 ، حيث 1 هو أصغر حجم و 7 هو الأكبر.
النص
النص
بالإضافة إلى العلامة ، يمكنك استخدام العلامات ,
تحدد العلامة أكبر حجم للخط ، وتحدد العلامة أصغر حجم. على سبيل المثال:
رأس المستوى الأول
رأس المستوى الثاني
رأس المستوى الثالث
جميع العلامات المذكورة أعلاه أسلب النص على مستوى رمز هتمل. للحصول على أنماط وإعدادات أكثر تعقيدا ومرونة ، فمن المستحسن استخدام كس.
ضبط حجم النص في كس
إذا كنت ترغب في تغيير حجم خط النص على موقعك ، يمكنك استخدام كس (أوراق الأنماط المتتالية). المغلق يسمح لك بسهولة ومرونة تعيين أحجام الخطوط لعناصر مختلفة من صفحة ويب.
هناك عدة طرق لتعيين حجم الخط باستخدام كس:
- استخدام أحجام الخطوط النسبية: يمكنك تحديد حجم الخط فيما يتعلق بحجم خط العنصر الأصل أو بحجم الخط القياسي للمتصفح. على سبيل المثال ، لتعيين حجم الخط إلى 1.2 مرات حجم الخط من العنصر الأصل ، يمكنك استخدام قيمة"1.2 إم".
- استخدام أحجام الخطوط المطلقة: يمكنك تحديد حجم الخط بوضوح بالبكسل أو النقاط أو النسب المئوية أو وحدات القياس الأخرى. على سبيل المثال ، لتعيين حجم الخط إلى 14 بكسل ، يمكنك استخدام القيمة "14 بكسل".
- استخدام القيمة" صغير "أو" متوسط "أو" كبير": تمثل هذه القيم أحجام خطوط نسبية تعتمد على إعداد الخط المحدد للمتصفح.
لتعيين حجم الخط لعنصر معين في كس ، يمكنك استخدام خاصية "حجم الخط". على سبيل المثال ، لتعيين حجم الخط إلى 16 بكسل لجميع الفقرات ، يمكنك استخدام رمز كس التالي:
ص {
حجم الخط: 16 بكسل;
}
يمكنك أيضا استخدام القيم المدمجة وتحديد حجم الخط لعناصر مختلفة على صفحة الويب الخاصة بك.
بكسل (بكسل): واحدة من وحدات القياس الأكثر شيوعا لحجم الخط. البكسل هو نقطة على الشاشة ، ويتم تحديد حجم الخط في عدد البكسل. على سبيل المثال:
حجم الخط: 150%
بالنسبة للعنصر الفرعي ، سيكون حجم خط العنصر الفرعي 24 بكسل.
الأبعاد النسبية (م): تشير وحدة القياس هذه أيضا إلى العنصر الأصل. عند تحديد حجم الخط في م ، تكون قيمة 1 م مساوية لحجم الخط الافتراضي للمتصفح (عادة 16 بكسل). على سبيل المثال:
حجم الخط: 1.5 م;
يعتمد اختيار وحدة القياس المناسبة على المهمة المحددة وتصميم الموقع. يوصى باستخدام الوحدات النسبية مثل النسب المئوية أو م ، لأنها تسمح لك بضبط أحجام الخطوط بشكل أكثر مرونة للأجهزة والشاشات المختلفة.
مثال على استخدام الوحدة النسبية م:
في هذا المثال ، سيكون حجم الخط 120٪ من حجم الخط الافتراضي للمتصفح في الوقت الحالي.
| ضبط نمط النص واللون | يمكنك استخدام سمات النمط لتعيين نمط النص في هتمل | |
|---|---|---|
. باستخدام | سمة النمط | |
السمة | الوصف | |
حجم الخط | يحدد حجم خط النص. | |
اللون
يحدد لون النص.
النص
يحدد محاذاة النص.
النص
بالإضافة إلى استخدام سمات النمط ، يمكنك أيضا استخدام الأنماط المضمنة المحددة في أوراق أنماط كس.
نموذج التعليمات البرمجية باستخدام الأنماط المضمنة:
النص
يمكنك أيضا استخدام ملفات الأنماط الخارجية المتصلة باستخدام علامة
. في مثل هذه الملفات ، يمكنك تحديد أنماط مختلفة واستخدامها لعناصر مختلفة على الموقع.
- مثال على توصيل ملف نمط خارجي:
- في ملف الأنماط.يمكن تعريف أنماط كس للنص:
- ف { حجم الخط: 16 بكسل ؛ اللون: أخضر ؛ محاذاة النص: تبرير؛}
استخدام أحجام الخطوط النسبية
نص بقيمة 2 م
نص بقيمة 2 ريم
نص بقيمة 150%
تعد أحجام الخطوط النسبية ملائمة لأنها تسمح لك بإنشاء مواقع تكيفية حيث تتكيف أحجام النص مع دقة الشاشة المختلفة وتفضيلات المستخدم.
- حجم الخط التكيفي للأجهزة المختلفة
- تتمثل إحدى طرق تعيين حجم خط متكيف في استخدام وحدات قياس نسبية مثل النسب المئوية أو م (حجم خط شرطي يعتمد على حجم الخط الأساسي كنسبة مئوية أو مضروبا في عدد م).
- لتعيين حجم الخط كنسبة مئوية ، يتم استخدام سمة النمط مع خاصية حجم الخط المغلق. على سبيل المثال ، لتعيين حجم الخط إلى 150 ٪ بالنسبة إلى حجم الخط الافتراضي ، يمكنك استخدام التعليمات البرمجية التالية:
- نص بحجم الخط التكيفي
- لاستخدام إم كوحدة خط نسبي ، تحتاج أولا إلى تعيين حجم الخط الأساسي في كس. ثم ، في سمة النمط ، يمكنك تحديد حجم الخط في م نسبة إلى القيمة الأساسية. على سبيل المثال:
- نص بحجم الخط التكيفي
- يعرض هذا القسم السيرة الذاتية للمرشح لهذا المنصب.
معلومات الاتصال: الهاتف-8 (999) 123-45-67 ، البريد الإلكتروني — [email protected]