يعد تغيير الخط على صفحة الويب إحدى الطرق الرئيسية لإنشاء تصميم فريد وزيادة إمكانية قراءة المحتوى. ومع ذلك ، ليس من السهل دائما تحديد الخط المطلوب وتخصيصه ، خاصة إذا كنت مطورا مبتدئا.
في هذه المقالة ، سنلقي نظرة على دليل مفصل حول تعيين الخطوط باستخدام كس. ستتعرف على طرق مختلفة لتحديد الخطوط ، وضبط الحجم ونمط الخط ، وكذلك كيفية توصيل الخطوط من مصادر خارجية.
الطرق الرئيسية لتعيين الخطوط
1. يعد تعيين الخطوط حسب العائلات هو الطريقة الأكثر شيوعا. توفر المتصفحات الحديثة مجموعة من الخطوط المضمنة التي يتم تطبيقها تلقائيا على عناصر صفحة الويب إذا كان خط معين غير متوفر على جهاز المستخدم.
2. يعد استخدام خطوط النظام العالمية طريقة بديلة. يمكنك تحديد قائمة بخطوط النظام التي سيستخدمها المتصفح إذا لم تكن هناك خطوط مفضلة.
3. ربط الخطوط الخارجية هو الطريقة الأكثر مرونة وقابلة للتوسيع. يمكنك توصيل الخطوط باستخدام خدمات خاصة مثل خطوط جوجل ، أو استخدام ملفات الخطوط الخاصة بك الموجودة على الخادم الخاص بك.
أن تستمر…
- كيفية تعيين خط كس
- اختيار الخط في المغلق
- تحديد حجم الخط في المغلق
كيفية تعيين خط كس
هناك عدة طرق لتعيين خط في كس.
| الطريقة | مثال | الوصف |
|---|---|---|
| الخط الأسرة | الخط الأسرة: أريال ، بلا الرقيق; | يحدد الخط لعنصر أو مجموعة من العناصر. إذا لم يكن الخط المحدد متاحا ، فسيستخدم المتصفح الخط التالي من القائمة. |
| @الخط الوجه | @الخط الوجه { | يسمح لك بتنزيل واستخدام الخطوط التي ليست خطوط المتصفح الافتراضية على صفحة الويب. |
| حجم الخط | حجم الخط: 16 بكسل; | يحدد حجم الخط لعنصر أو مجموعة من العناصر. يمكن تحديد القيمة بالبكسل أو النسب المئوية أو وحدات القياس الأخرى المقبولة. |
| الخط الوزن | وزن الخط: غامق; | يحدد تشبع الخط لعنصر أو مجموعة من العناصر. يمكن تحديد القيمة ككلمة رئيسية (على سبيل المثال ، "غامق") أو رقم (على سبيل المثال ، "700"). |
| نمط الخط | نمط الخط: مائل; | يحدد نمط الخط لعنصر أو مجموعة من العناصر. القيم المقبولة هي" عادي "و" مائل "و"مائل". |
الآن ، ومعرفة الطرق المختلفة ، يمكنك بسهولة تعيين الخطوط في كس الخاص بك وإنشاء تصميم النص المطلوب على موقع الويب الخاص بك.
اختيار الخط في المغلق
فيما يلي بعض الطرق الرئيسية لاختيار خط في كس:
| الملكية المغلق | الوصف | مثال |
|---|---|---|
| الخط الأسرة | يحدد قائمة الخطوط المفضلة التي يجب استخدامها لعرض النص. | الخط الأسرة: أريال ، بلا الرقيق; |
| @الخط الوجه | يسمح لك بتنزيل واستخدام الخطوط غير القياسية للمتصفح. | |
| حجم الخط | يحدد حجم الخط لعرض النص. | حجم الخط: 16 بكسل; |
| الخط الوزن | يحدد تشبع الخط. ربما عادي, بالخط العريض, 100, 200,..., 900. | وزن الخط: غامق; |
| نمط الخط | يحدد نمط الخط. يمكن أن يكون طبيعيا ، مائل ، مائل ، يرث. | نمط الخط: مائل; |
، لديك الترخيص المناسب.
اختيار الخط في كس يلعب دورا هاما في إنشاء صفحة ويب جماليا وظيفية. عند اختيار الخط ، ضع في اعتبارك سهولة قراءة النص ومراسلاته مع موضوع الصفحة ومزاجها.
تحديد حجم الخط في المغلق
لتعيين حجم النص في كس ، تحتاج إلى استخدام خاصية حجم الخط. يمكنك استخدام هذه الخاصية لتحديد حجم الخط المطلوب للنص الخاص بك.
يمكن أن تأخذ خاصية حجم الخط قيما مختلفة. يمكنك تحديد حجم الخط بالبكسل (بكسل) أو النسب المئوية ( ٪ ) أو إم (إم) أو وحدات القياس الأخرى.
يوضح الجدول التالي القيم المحتملة لخاصية حجم الخط ووصفها:
| المعنى | الوصف |
|---|---|
| س س-صغير | حجم الخط صغير جدا |
| س-صغير | حجم الخط الصغير |
| صغير | حجم الخط الصغير |
| متوسطة | متوسط حجم الخط (افتراضي) |
| كبير | حجم الخط الكبير |
| اكس كبير | حجم خط كبير جدا |
| كبير | حجم خط كبير جدا جدا |
| بكسل (بكسل) | حدد حجم الخط بالبكسل |
| النسب المئوية ( ٪ ) | حدد حجم الخط كنسبة مئوية من حجم العنصر الأصل |
| م (م) | حدد حجم الخط بالبوصة (نسبة إلى حجم الخط الحالي) |
أمثلة:
/ * تحديد حجم الخط بالبكسل */