كيفية إنشاء زر من شعبة على موقع الويب الخاص بك

الأزرار هي أحد العناصر الرئيسية لواجهة المستخدم على الموقع. أنها تسمح للمستخدمين بالتفاعل مع صفحة ويب وتنفيذ إجراءات معينة. عادة ما يتم إنشاء الأزرار باستخدام علامة. ومع ذلك ، في بعض الأحيان تحتاج إلى إنشاء زر يبدو مختلفا عن الزر القياسي. في هذه المقالة ، سننظر في كيفية إنشاء مثل هذا الزر باستخدام علامة

.

العلامة

هي واحدة من عناصر كتلة الأساسية من هتمل وهي حاوية لعناصر أخرى. يمكنك استخدامه لإنشاء مكونات مختلفة ووضعها على صفحة ويب. لإنشاء زر من ديف ، تحتاج إلى إضافة أنماط كس معينة لذلك.

1. أولا ، دعونا إنشاء عنصر ديف باستخدام علامة
2. . ثم ، لتحويله إلى زر ، سنقوم بتعيين الأنماط اللازمة لذلك. يمكنك استخدام خصائص كس مثل لون الخلفية ولون الخط والعرض والارتفاع والحدود وغيرها. تجربة مع قيم مختلفة لتحقيق المظهر المطلوب.
3. بعد تعيين الأنماط اللازمة ، سنضيف معالج أحداث جافا سكريبت بحيث يقوم الزر بتنفيذ إجراءات معينة عند النقر عليه. داخل المعالج ، يمكنك تحديد أي رمز يجب تنفيذه بعد النقر فوق الزر ، على سبيل المثال ، الانتقال إلى صفحة أخرى أو إرسال البيانات إلى الخادم.
4. خيارات لإنشاء زر على موقع ويب باستخدام ديف
5. 1. زر بسيط
6. 2. زر تنفيذ الإجراء
7. 3. زر مع رمز
8. باستخدام فئات كس إلى نمط ديف
9. سؤال وجواب
10. ما هي مزايا إنشاء زر من شعبة على موقع على شبكة الانترنت?

كيف يمكنني إنشاء زر من شعبة على موقع على شبكة الانترنت?

كيف يمكنني تخصيص نمط زر من شعبة?

كيف يمكنني إضافة إجراء عند النقر على زر من شعبة على موقع على شبكة الانترنت?

خيارات لإنشاء زر على موقع ويب باستخدام ديف

إنشاء أزرار على الموقع باستخدام عناصر ديف يجعل من الممكن لتخصيص بمرونة وأسلوب لهم وفقا لتصميم الموقع. فيما يلي بعض الخيارات لإنشاء زر:

1. زر بسيط

يمكن إنشاء زر بسيط باستخدام عنصر ديف وإضافة أنماط:

زر

2. زر تنفيذ الإجراء

إذا كان الزر ينفذ أي إجراء ، يمكنك إضافة سمة أونكليك وتحديد وظيفة جافا سكريبت ليتم استدعاؤها:

زر

3. زر مع رمز

هذه ليست سوى عدد قليل من الخيارات لإنشاء أزرار باستخدام عناصر ديف. يمكن إضافة أنماط ووظائف إضافية اعتمادا على متطلبات موقعك.

باستخدام فئات كس إلى نمط ديف

لتطبيق فئة كس على عنصر

تحتاج إلى إضافة سمة

فئة

، يمكنك تحديد أنماط لفئة "صفي" باستخدام"."محدد. على سبيل المثال:

. صفي {

اللون: أحمر;

حجم الخط: 18 بكسل;

}

هذا كل شيء الآن 

ستحتوي العناصر التي تحتوي على فئة" صفي " على نص أحمر وحجم خط 18 بكسل.

. للقيام بذلك ، تحتاج إلى تحديد قيم عدة فئات في السمة

فئة

مفصولة بمسافة. سيتم تطبيق الفصول بالترتيب وسيتم تطبيق الأنماط المناسبة.

سيكون لهذا القسم أنماط من الفصول "صفي 1" و "صفي 2"