كيفية تثبيت وتكوين أنماط الخطوط: دليل مفصل

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

قبل البدء في تعيين أنماط لخط على موقع ويب ، تحتاج إلى تحديد الخط المناسب. هناك العديد من خطوط الويب التي يمكن استخدامها مجانا أو شراؤها للاستخدام التجاري. يعتمد الخط الأنسب لموقعك على الويب على موضوعه وأهدافه.

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

مثال على توصيل خط بصفحة ويب باستخدام كس:

@استيراد رابط ('https://fonts.googleapis.com/css?family=Roboto:400, 700 & عرض = مبادلة');

الجسم {

الخط الأسرة: 'روبوتو' ، بلا الرقيق;

}

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

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

1. تثبيت وتكوين أنماط الخطوط
2. 1. تثبيت الخطوط
3. 2. تحديد حجم الخط
4. 3. ضبط نمط الخط
5. 4. ضبط الخط
6. حجم 5. ضبط لون الخط
7. تثبيت ملفات الخطوط المطلوبة
8. توصيل خط بصفحة ويب
9. استخدام الأنماط للخط

تثبيت وتكوين أنماط الخطوط

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

1. تثبيت الخطوط

يحدد اسم الخط الذي سيتم استخدامه لهذا العنصر.

مثال:

النص باستخدام الخط أريال.

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

2. تحديد حجم الخط

يتم تحديد حجم الخط المطلوب.

مثال:

نص بحجم خط 18 بكسل.

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

3. ضبط نمط الخط

يمكن ضبطه على إحدى القيم التالية:

• - نمط منتظم;
• - نمط مائل;
• هو نمط مائل.

مثال:

نص بنمط خط مائل.

4. تحديد حجم الخط

يمكنك تحديد إحدى القيم التالية:

• - محتوى الدهون العادي;
• - خط غامق;
• - خط أرق.

مثال:

نص غامق.

5. ضبط لون الخط

يتم تحديد لون الخط المطلوب.

مثال:

النص مع لون الخط الأحمر.

).

كان هذا دليلا مفصلا لتثبيت وتكوين أنماط لخط في هتمل. يمكنك الجمع بين خيارات مختلفة لإنشاء تصميم فريد لصفحة الويب.

تثبيت ملفات الخطوط المطلوبة

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

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

ستسمح لك الخطوات التالية بتثبيت ملفات الخطوط الضرورية:

1. ابحث عن ملفات الخطوط وقم بتنزيلها من جهاز الكمبيوتر الخاص بك أو من الإنترنت.
2. قم بإنشاء مجلد جديد على الخادم الخاص بك حيث سيتم تخزين جميع ملفات الخطوط.
3. انقل ملفات الخطوط التي تم تنزيلها إلى المجلد الذي تم إنشاؤه.
4. تأكد من أن أسماء ملفات الخطوط لا تحتوي على مسافات أو أحرف خاصة.
5. قم بتعيين أذونات ملف الخط الصحيحة حتى يتمكن المتصفح من تنزيلها.

بعد الانتهاء من هذه الخطوات ، تكون جاهزا لبدء استخدام الخط المثبت على موقع الويب الخاص بك.

توصيل خط بصفحة ويب

من أجل استخدام خط غير قياسي على صفحة الويب الخاصة بك ، يجب توصيله باستخدام أنماط كس. للقيام بذلك ، اتبع الخطوات أدناه:

1. احصل على ملف الخط

قم بتنزيل ملف الخط الذي تريد استخدامه على صفحة الويب الخاصة بك. عادة ما يتم توفير الخطوط بتنسيقات.صندوق النقد الدولي أو .أوتف.

2. قم بإنشاء مجلد خط على الخادم

قم بإنشاء مجلد باسم" الخطوط " على الخادم الخاص بك حيث سيتم تخزين ملف الخط.

3. قم بتحميل ملف الخط إلى الخادم

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

4. إنشاء ملف كس

إنشاء ملف جديد مع التمديد.المغلق ، على سبيل المثال " الأنماط.المغلق".

5. قم بتوصيل الخط في ملف كس

إضافة التعليمات البرمجية التالية إلى ملف كس الخاص بك:

}

استبدل "اسم الخط" باسم الخط الذي تريد استخدامه. يستعاض عن "/ اسم مقتصد / اسم مقتصد".الصناديق " إلى المسار إلى ملف الخط على الخادم الخاص بك.

6. تطبيق الخط على عناصر الصفحة

لاستخدام هذا الخط على صفحة الويب الخاصة بك ، قم بتطبيقه على العناصر المطلوبة عن طريق تحديد اسم الخط:

}

استبدل "اسم الخط" باسم الخط الذي تريد استخدامه.

الآن بعد أن قمت بتوصيل الخط بصفحة الويب الخاصة بك ، يمكنك استخدامه لتصميم نص وعناصر صفحتك.

استخدام الأنماط للخط

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

لتطبيق الأنماط على النص ، يجب تحديد خصائص الخط المطلوبة داخل علامة النمط. على سبيل المثال ، لتغيير لون النص إلى اللون الأحمر ، يمكنك استخدام التعليمات البرمجية التالية:

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

يحدد هذا الرمز النمط لجميع رؤوس المستوى الأول ح1 على صفحة ويب. يتم تعيين حجم الخط إلى 24 بكسل ، يتم استخدام الخط أريال ، يتم تحديد نمط الخط الغامق ومحاذاة النص في المركز.

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