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