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