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