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

من خلال تصميم شريط التنقل الخاص بك بطريقة معينة ، يمكنك تعزيز العلامة التجارية والتصميم لشركتك. باستخدام مجموعة من كود HTML و CSS (ورقة الأنماط المتتالية) لإملاء مظهر شريط التنقل الخاص بك ، يمكنك إنشاء شكل وأسلوب عرض متسقين في جميع أنحاء موقعك. إذا اخترت جعل شريط التنقل شفافًا ، فهذا يعني أنه سيكون بنفس لون الخلفية أو خلفية العنصر الذي يحتوي عليه.

1

قم بإنشاء قسم HTML لشريط التنقل الخاص بك. في ملف HTML للصفحة التي تعمل بها ، حدد القسم الذي ترغب في إضافة شريط التنقل إليه. استخدم عنصرًا لاحتوائه على النحو التالي:

بين علامتي الافتتاح والختام يمكنك وضع روابط التنقل الخاصة بك.

2

قم بتضمين عنصر ربط لكل رابط تنقل تحتاجه. داخل عنصر "التنقل" ، أضف عنصر ربط لكل رابط تريد أن يتمكن المستخدمون من تصفحه. فيما يلي نموذج لعنصر ربط يرتبط بقسم موقع:

حول

يرتبط هذا بقسم داخل الموقع موجود في مجلد باسم "حول" موجود في نفس الدليل مثل الصفحة التي يظهر فيها هذا الرمز. للارتباط بصفحة بدلاً من مجلد ، يجب أن تظهر العلامة على النحو التالي لـ HTML :

حول

3

أضف قسم النمط إلى صفحتك. لتصميم شريط التنقل ، تحتاج إلى قسم لرمز CSS. في قسم رأس صفحتك ، قبل علامة الإغلاق ، أضف واحدة على النحو التالي:

داخل هذا يمكنك إضافة تصريحات لتصميم العناصر في صفحتك.

4

صمم المراسي. في قسم CSS بصفحتك ، أضف إعلانات لتصميم نقاط الارتساء في شريط التنقل. على سبيل المثال ، لتصميم جميع عناصر الارتساء داخل "التنقل" كسمة معرف ، يمكنك استخدام المحددات التالية:

/ أسلوب الإعلانات /

}

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

زخرفة النص: لا شيء ؛ العرض: 100 بكسل ؛ العرض محجوب؛ تعويم: اليسار؛

هذه خصائص قياسية لعرض المراسي جنبًا إلى جنب على خط أفقي. لتحديد نمط العنصر نفسه ، استخدم بناء الجملة التالي:

العرض: 800 بكسل ؛ }

5

نمط الخلفية. إذا لم تقم بتطبيق خاصية الخلفية على شريط التنقل الخاص بك في CSS ، فسيتم عرضها بخلفية شفافة بشكل افتراضي. ومع ذلك ، قد يتم عرضها مع خلفية الصفحة أو عنصر آخر خلفها. على سبيل المثال ، سيؤدي إعلان CSS التالي لعنصر النص الأساسي إلى عرض صورة الخلفية خلف شريط التنقل:

الجسم {background-image: url ("bgpic.jpg") ؛ }

ما لم تحدد إما صورة خلفية أو لونًا لشريط التنقل ، يجب أن يتم عرضه بخلفية شفافة.