نحوه ساخت یک منوی کشویی عمودی

فهرست مطالب:

نحوه ساخت یک منوی کشویی عمودی
نحوه ساخت یک منوی کشویی عمودی

تصویری: نحوه ساخت یک منوی کشویی عمودی

تصویری: نحوه ساخت یک منوی کشویی عمودی
تصویری: ناوبری جانبی با کشویی | HTML و CSS || JDBCODE 2024, ممکن است
Anonim

منوی کشویی عمودی بسیار مفید است - باعث صرفه جویی در فضای صفحه وب می شود ، در عین حال به پیمایش آسان سایت کمک می کند. سعی کنید یک منوی کشویی بر اساس CSS - Cascading Style Sheets ایجاد کنید. اگر هنوز در زمینه ایجاد کد CSS متخصص نیستید ، از سرویس purecssmenu.com استفاده کنید. شما باید نوع منو را انتخاب کنید ، شکل ظاهری آن را سفارشی کنید و سپس آن را با سایت خود تطبیق دهید. این سرویس خود کد لازم را تولید می کند ، سپس آن را در پرونده های سایت خود وارد می کنید.

نحوه ساخت یک منوی کشویی عمودی
نحوه ساخت یک منوی کشویی عمودی

دستورالعمل ها

مرحله 1

در وب سایت purecssmenu.com ثبت نام کنید ، در غیر این صورت نمی توانید منوی ایجاد شده را بارگیری کنید. روی دکمه الگوها در سمت چپ صفحه کلیک کنید. در زیر چندین پنجره کوچک با الگوهای منوی کشویی مشاهده خواهید کرد که با کلیک بر روی آن ، یک پیش نمایش در سمت راست در پنجره Preview بارگیری می شود. الگویی متناسب با سایت خود انتخاب کنید

گام 2

قلم و رنگ منو را سفارشی کنید: از تب Parameters استفاده کنید. در قسمت Font ، در صورت لزوم یک قلم ، اندازه قلم ، زیرخط و پررنگ را انتخاب کنید. در قسمت Colors ، پس زمینه منو ، رنگ قلم و رنگ شناور قلم و شناور پس زمینه را تنظیم کنید

مرحله 3

برای مدیریت موارد منو ، برگه موارد را باز کنید. اگر روی دکمه پاک کردن سطل آشغال پاک کنید ، موارد نمونه پاک می شوند و می توانید مورد خود را ایجاد کنید. برای این کار ، دکمه Add Item plus را فشار دهید - مورد به انتهای منو اضافه می شود. دکمه افزودن مورد بعدی برای افزودن مورد پس از زمان انتخاب شده در حال حاضر استفاده می شود. دکمه Add Subitem یک مورد زیر منو برای انتخاب ایجاد می کند. بر این اساس ، برای حذف مورد ، از دکمه حذف مورد استفاده کنید

مرحله 4

به قسمت پارامترهای مورد در پایین سایت توجه کنید. در خط متن ، نام مورد منو را در خط پیوند مشخص کنید - آدرس صفحه ای که این مورد به آن منتهی می شود. در خط نکته ، می توانید توضیحات مربوط به مورد را بگذارید ، که هنگام قرار گرفتن روی پیوند نشان داده می شود. از خط هدف برای تعیین راه باز کردن صفحه ای که پیوند به آن منجر می شود استفاده می شود. پارامتر _elf در این خط صفحه را در همان پنجره مرورگر باز می کند که در حال حاضر است

مرحله 5

پس از اتمام تنظیم منو ، آن را بارگیری کنید - روی دکمه بارگیری در پایین سمت راست صفحه کلیک کنید (این عملکرد پس از ثبت نام در سایت در دسترس است). پوشه ای را بر روی هارد دیسک خود انتخاب کنید که در آن پرونده بایگانی ذخیره شود. آن را باز کنید شما باید کد مورد نیاز را از پرونده purecssmenu.html در پرونده الگوی CSS سایت خود کپی کنید. فایل purecssmenu.html را با یک ویرایشگر متن باز کنید و کدها را بین برچسب ها و در قالب CSS سایت خود کپی کنید (این فایل دارای پسوند.css است و چیزی شبیه به file.css دارد). اکنون کد را در پرونده الگوی سایت (موضوعات) خود قرار دهید - کد موجود در purecssmenu.html بین نظرات و به جای کد منوی عادی. برای این کار باید حداقل کمی با برنامه نویسی آشنا باشید. اطمینان حاصل کنید که کد را در پرونده صحیح وارد کرده و ذخیره کنید.

توصیه شده: