يعد تغيير حجم الخط في هتمل جزءا مهما من إنشاء موقع ويب جميل وقابل للقراءة. يمكن أن يؤثر حجم الخط الصحيح بشكل كبير على الإدراك البصري للمحتوى ويحسن تجربة المستخدم.
طريقة واحدة لتغيير حجم الخط للصفحة بأكملها هي استخدام وحدات كس مثل بكسل (بكسل) أو النسب المئوية ( ٪ ). على سبيل المثال ، لتعيين حجم الخط إلى 16 بكسل للصفحة بأكملها ، يمكنك إضافة التعليمات البرمجية التالية إلى الأنماط.قسم المغلق من المشروع الخاص بك:
الجسم { حجم الخط: 16 بكسل؛}
سيقوم هذا الرمز بتعيين حجم الخط على 16 بكسل لجميع عناصر الجسم في موقع الويب الخاص بك.
بالإضافة إلى ذلك ، يمكنك استخدام الوحدات النسبية مثل حركة العين السريعة أو م لتغيير حجم الخط إلى الصفحة بأكملها. على سبيل المثال ، إذا قمت بتعيين حجم الخط إلى 1.2 ريم لعنصر هتمل ، جميع العناصر الأخرى على الصفحة سوف تتعلق بهذا الحجم اعتمادا على التعشيش.
- دليل لتغيير حجم الخط في هتمل
- تحديد حجم الخط العالمي
- استخدام وحدات القياس النسبية
- تطبيق سمة النمط لتغيير حجم الخط
- استخدام الطبقات لنمط الخط
- تغيير حجم الخط باستخدام ملفات كس
- تطبيق استعلامات الوسائط لحجم الخط التكيفي
- تغيير حجم الخط للعناصر المحددة فقط
- تغيير حجم الخط باستخدام أنماط مدمجة
دليل لتغيير حجم الخط في هتمل
في هتمل ، هناك عدة طرق لتغيير حجم الخط إلى الصفحة بأكملها. يمكن أن تستند هذه الأساليب على استخدام خصائص كس المختلفة أو على استخدام علامات هتمل.
طريقة واحدة هي استخدام كس. للقيام بذلك ، استخدم خاصية حجم الخط وقم بتعيين قيمتها على الرقم المطلوب الذي يشير إلى حجم الخط بالبكسل (على سبيل المثال ، حجم الخط: 16 بكسل؛). يمكن القيام بذلك داخل علامة النمط أو ملف كس خارجي.
إذا كنت تريد تغيير حجم الخط لعنصر صفحة معين فقط ، فيمكنك استخدام علامة خط هتمل. للقيام بذلك ، قم بتعيين سمة الحجم بقيمة تشير إلى حجم الخط المطلوب (على سبيل المثال ، النص). أكبر عدد ، وأكبر حجم الخط.
من المهم أن تتذكر أنه إذا كنت ترغب في تغيير حجم الخط للصفحة بأكملها ، فمن الأفضل استخدام كس ، لأن علامات هتمل يمكن أن يكون لها أنماط عالمية تؤثر على أحجام الخطوط.
بغض النظر عن الطريقة التي تختارها ، يوصى بتعيين حجم الخط بالنسبة إلى حجم نافذة المتصفح باستخدام وحدات القياس النسبية مثل النسب المئوية أو م. سيساعد ذلك في الحفاظ على حجم الخط عند تغيير حجم نافذة المتصفح أو عرض الصفحة على الأجهزة ذات الشاشات المختلفة.
تحديد حجم الخط العالمي
يمكن تعيين حجم الخط العالمي لصفحة هتمل بأكملها باستخدام نمط كس.
للقيام بذلك ، استخدم نمط "حجم الخط" وحدد حجم الخط المطلوب لعنصر "الجسم". على سبيل المثال ، لتعيين حجم الخط إلى 16 بكسل ، تحتاج إلى إضافة الأسطر التالية إلى ملف كس:
الجسم {
إذا كنت تريد استخدام الوحدات النسبية (مثل النسب المئوية) بدلا من وحدات البكسل ، فيمكنك تغيير قيمة "حجم الخط" وفقا لذلك.
استخدام وحدات القياس النسبية
عند العمل مع أحجام الخطوط في هتمل ، فمن المستحسن استخدام وحدات القياس النسبية مثل النسب المئوية ( ٪ ) ، إم و ريم. يتيح لك ذلك التحكم بمرونة في حجم الخط ويوفر تصميم صفحة ويب أكثر استجابة.
تستخدم النسب المئوية لتعيين حجم الخط بالنسبة إلى حجم العنصر الأصل. على سبيل المثال ، إذا كان العنصر الأصل يحتوي على حجم خط 16 بكسل وقمت بتعيين حجم الخط كنسبة مئوية:
تستخدم وحدات إم و ريم أيضا لتعيين حجم الخط النسبي ، ولكنها تتوافق مع حجم العنصر الحالي أو الجذر ، على التوالي. على سبيل المثال ، إذا قمت بتعيين حجم الخط إلى 1 م ، فهذا يعني أن حجم الخط يساوي حجم العنصر الحالي. إذا قمت بتعيين حجم الخط إلى 1 ريم ، فهذا يعني أن حجم الخط يساوي حجم العنصر الجذر (عادة ما يتم تحديده في العلامة الأصل
يتيح لك استخدام وحدات القياس النسبية إنشاء تخطيطات تكيفية ومرنة يمكن تحجيمها بسهولة اعتمادا على حجم الشاشة أو الجهاز الذي يتم عرض صفحة الويب عليه.
تطبيق سمة النمط لتغيير حجم الخط
لتغيير حجم الخط للصفحة بأكملها في هتمل ، يمكنك استخدام سمة النمط. يتم تطبيق هذه السمة على العلامات التي يجب تصميم محتوياتها ، وتسمح لك بتعيين معلمات مظهر مختلفة لهذه العناصر.
لتغيير حجم الخط ، يمكنك استخدام خاصية" حجم الخط " مع وحدات القياس. على سبيل المثال ، لتعيين حجم الخط النسبي ، يمكنك استخدام النسب المئوية أو الوحدات النسبية مثل "إم" أو "ريم".
مثال على استخدام سمة النمط لتغيير حجم الخط:
هذا نص بحجم خط 20 بكسل
في هذا المثال ، يتم تعيين حجم الخط إلى 20 بكسل للعلامة
. يمكنك استخدام هذا الأسلوب لأي علامة تريد تغيير حجم الخط فيها.