يعد الخط من أهم عناصر تصميم الموقع ، حيث يؤثر على إدراك المعلومات وشعور المستخدم عند التفاعل مع المحتوى. يمكن أن يؤدي استخدام الخط الصحيح إلى تحسين إمكانية قراءة النص ، وإعطاء الموقع نمطا وتمييزه عن الآخرين. كس لديها عدة طرق لتعيين الخطوط للنص ، بما في ذلك تحميل الخطوط باستخدام @الخط الوجه واستخدام خطوط النظام القياسية.
واحدة من أكثر الطرق شيوعا لتعيين الخطوط هي استخدام عائلات الخطوط. يوفر كس مجموعة من الأسر الخط مسبقا مثل "بلا الرقيق" ، "الرقيق" ، "مونوسباس" وغيرها. يمكنك استخدام مجموعات الخطوط هذه عن طريق تحديدها في خاصية "عائلة الخط" لتحديد خط لكل النص على الموقع.
لديه المغلق أيضا خيار استخدام الخطوط المخصصة محملة @الخط الوجه. للقيام بذلك ، يجب عليك أولا تحميل الخط إلى الخادم وإضافته إلى ملف كس الخاص بك باستخدام قاعدة @الخط الوجه. ثم يمكنك استخدامه بنفس طريقة أي خط آخر عن طريق تحديد اسمه في خاصية "عائلة الخط". بهذه الطريقة يمكنك اختيار خط فريد ومميز لكل النص على موقعك.
تصبح إدارة محتوى النص أبسط وأكثر مرونة باستخدام كس للخطوط ، مما يسمح لك بإنشاء تصميمات فريدة وجديدة لموقعك. عن طريق اختيار الخط الصحيح ووضعه باستخدام كس ، يمكنك جعل النص الخاص بك أكثر تعبيرا ، وتحسين المؤثرات البصرية وتعزيز الانطباع من المحتوى الخاص بك.
- المغلق الخط لجميع النص على الموقع: حالتين الاستخدام
- أنماط مضمنة في كس
- ملفات كس الخارجية
المغلق الخط لجميع النص على الموقع: اثنين من حالات الاستخدام
تسمح أوراق الأنماط المتتالية لمطوري الويب بتغيير مظهر جميع عناصر النص على الموقع بسهولة. باستخدام كس ، يمكنك تعيين الخطوط لكل النص على الصفحة ، بما في ذلك العناوين والفقرات والقوائم وعناصر النص الأخرى.
هناك طريقتان رئيسيتان لاستخدام الخطوط في كس لجميع النصوص على الموقع.
1. باستخدام المحدد العالمي *
الخيار الأول هو استخدام المحدد العام " * " ، والذي يطبق الأنماط على جميع العناصر الموجودة على الصفحة. هذا يعني أنه سيتم عرض أي نص على الموقع بالخط المحدد.
مثال على استخدام محدد عمومي لتعيين خط:
"'المغلق
* {
الخط الأسرة: أريال ، بلا الرقيق;
}
في هذا المثال ، سيتم تطبيق الخط أريال لجميع العناصر على الصفحة. إذا أريال غير متوفر على جهاز المستخدم ، سيتم استخدام خط بديل بلا الرقيق.
ميزة هذا النهج هو أنه يسمح لك بسهولة وبسرعة تطبيق خط معين على النص بأكمله على الموقع. ومع ذلك ، قد يكون هذا النهج غير فعال من حيث الأداء ، حيث يتم تطبيق الأنماط على جميع العناصر الموجودة على الصفحة ، بما في ذلك تلك التي لا تحتاج إليها.
2. باستخدام محدد الجسم
الخيار الثاني هو استخدام محدد النص لتعيين الخط للنص بأكمله على الموقع. يسمح لك هذا بتطبيق الأنماط فقط على العناصر الموجودة داخل علامة النص ، باستثناء عناصر الرأس والتنقل وأجزاء أخرى من الصفحة التي قد يكون لها خط خاص بها.
مثال على استخدام محدد الجسم لتعيين الخط:
"'المغلق
الجسم {
الخط الأسرة: "فتح بلا" ، بلا الرقيق;
}
في هذا المثال ، سيتم تطبيق الخط" فتح بلا " على جميع العناصر الموجودة داخل علامة الجسم. إذا "فتح بلا" غير متوفر ، سيتم استخدام استبدال الخط بلا الرقيق.
هذا النهج أكثر مرونة ، لأنه يجعل من السهل تغيير الخط فقط لعناصر النص على الصفحة ، دون التأثير على العناصر الأخرى.
اعتمادا على متطلبات التصميم والاحتياجات المحددة للمشروع ، يمكنك اختيار أحد هذين الخيارين لتعيين الخط للنص بأكمله على الموقع.
أنماط مضمنة في كس
الأنماط المضمنة في كس هي طريقة لإضافة أنماط مباشرة إلى علامة هتمل. هذا يعني أن كل عنصر فردي يمكن أن يكون له أنماطه الخاصة التي تنطبق عليه فقط.
لإضافة أنماط مضمنة إلى عنصر هتمل ، يجب عليك استخدام السمة" نمط". يتم تحديد خصائص النمط وقيمها داخل هذه السمة ، مفصولة بفواصل منقوطة.
على سبيل المثال ، لتغيير لون نص فقرة إلى اللون الأحمر ، تحتاج إلى إضافة الكود التالي:
| كود أتش تي أم أل | النتيجة |
|---|---|
| نص الفقرة |
غالبا ما تستخدم الأنماط المضمنة لتطبيق الأنماط بسرعة على العناصر الفردية أو لإجراء تغييرات مؤقتة. ومع ذلك ، عند استخدام الأنماط المضمنة ، ضع في اعتبارك أنها تنتهك مبدأ فصل المحتوى والعرض التقديمي ، مما قد يجعل من الصعب الحفاظ على الكود وصيانته.
ملفات كس الخارجية
لإنشاء ملف كس خارجي ، تحتاج إلى إنشاء ملف نصي جديد وحفظه مع التمديد".المغلق". يمكنك بعد ذلك تحديد أنماط مختلفة في هذا الملف ، مثل حجم الخط ولون النص والمحاذاة وخصائص أخرى.
بعد إنشاء ملف كس ، يجب أن يكون متصلا بمستند هتمل باستخدام علامة. تحدد السمة " هريف "المسار إلى ملف النمط ، ويجب تعيين السمة" ريل "إلى"ورقة الأنماط". يمكنك أيضا تحديد السمة" النوع "مع القيمة" نص/كس " لتحديد نوع المستند بشكل صريح.
| نموذج التعليمات البرمجية |
|---|
|
من المهم ملاحظة أنه يجب وضع الرابط إلى ملف كس الخارجي داخل عنصر مستند هتمل.
بعد توصيل ملف كس ، سيتم تطبيق جميع الأنماط المحددة فيه على جميع عناصر النص على الموقع. على سبيل المثال ، إذا قمت بتحديد خصائص لعلامة في ملف كس ، فإن جميع الفقرات على الموقع سيكون لها نمط النص المحدد.
باستخدام ملفات كس الخارجية يبسط إدارة الأنماط ويسمح لك لتخصيص مظهر الموقع مع تغييرات صغيرة في ملف كس.