تغيير خصائص الخط

تعلم استخدام CSS لتغيير سمات الخط

الخطوط و CSS

تعد CSS الطريقة الأكثر فعالية لضبط الخطوط على صفحة الويب الخاصة بك. يمكنك التحكم في عائلة الخط وحجمه ولونه ووزنه والعديد من جوانب الطباعة الأخرى.

تعد خصائص الخط في CSS إحدى الطرق الأكثر شيوعًا لجعل صفحتك أكثر تميزًا وفريدة. من السهل تغيير اللون والحجم وحتى مواجهة (الخط نفسه) من النص الخاص بك مع خصائص خط CSS .

• اللون
• خط العائلة
• حجم الخط

هناك ثلاثة أجزاء للخط:

• اللون
  • هذا هو اللون الذي سيعرضه الخط على الشاشة.
• بحجم
  • هذه هي الطريقة التي سيظهر بها حجم أو حجم الخط على الشاشة.
• وجه
  • هذه هي عائلة الخط ، والتي يشار إليها غالبًا باسم الخط الفعلي.

ألوان الخط

لتغيير لون النص ، ما عليك سوى استخدام خاصية نمط لون CSS. يمكنك استخدام أسماء الألوان أو الرموز السداسية العشرية. كما هو الحال مع كل الألوان على الويب ، من الأفضل استخدام الألوان الآمنة للمتصفح .

جرب الأنماط التالية في صفحات الويب الخاصة بك:

هذا الخط باللون الأحمر
هذا الخط ملون باللون الأزرق

أحجام الخطوط

عند تعيين حجم الخط على الويب ، يمكنك تعيينه بأحجام نسبية أو تحديده باستخدام وحدات البكسل أو السنتيمترات أو البوصة. ومع ذلك ، من المفترض استخدام أحجام الخطوط الأكثر دقة للطباعة وليس لصفحات الويب ، حيث قد يكون لدى كل من يطلع على موقعك الإلكتروني دقة مختلفة ، أو حجم الشاشة ، أو إعداد الخط الافتراضي. وبالتالي ، إذا اخترت 15 بكسل كحجم قياسي لديك ، فقد تفاجئ دون قصد أن ترى حجم أو حجم الخط الذي يعرضه لعملائك.

أوصي باستخدام نظم الإدارة البيئية لحجم الخط . تسمح Ems بإمكانية الوصول إلى صفحتك بصرف النظر عمن يشاهدها ، وتهدف EMS إلى عرض الشاشة. اترك وحدات البكسل والنقاط الخاصة بك لعرض الطباعة. لتغيير حجم الخط ، ضع النمط التالي في صفحة الويب الخاصة بك:

هذا الخط هو 1em
هذا الخط هو .75em
هذا الخط هو 1.25em

وجوه الخط

وجه الخط الخاص بك هو ما يفكر فيه الكثير من الناس عندما يفكرون في "الخط". يمكنك الإعلان عن أي وجه خط تريده ، ولكن تذكر أنه إذا لم يكن القارئ لديك مثبتًا على الخط ، فسيحاول متصفحك العثور على تطابق لذلك ، ولن تبدو صفحتهم كما قصدت.

لمعالجة هذه المشكلة ، يمكنك تحديد قائمة بأسماء الوجه ، مفصولة بفواصل ، ليستخدمها المتصفح حسب ترتيب التفضيل. هذه تسمى مكدسات الخط. ضع في اعتبارك أن الخط القياسي على جهاز كمبيوتر (مثل Arial) قد لا يكون قياسيًا على ماكنتوش. لذلك يجب عليك دائمًا عرض صفحاتك باستخدام جهاز تم تثبيته بشكل بسيط (ويفضل أن يكون على كلا النظامين الأساسيين) للتأكد من أن صفحتك تبدو كما لو كانت مصممة بحد أدنى من الخطوط.

واحدة من مكدسات الخط المفضلة لدي هي هذه المجموعة هي مجموعة خطوط sans-serif و بينما لا تبدو Geneva و arial مشابهتين بشكل رهيب ، كلاهما قياسيان إلى حد ما على أجهزة كمبيوتر Macintosh و Windows . أقوم بتضمين helvetica و helv للعملاء في أنظمة التشغيل الأخرى مثل Unix أو Linux التي قد لا تحتوي على مكتبة خطوط قوية.

هذا الخط هو sans-serif
هذا الخط هو serif