نحوه ایجاد یک منوی عمودی برای یک وب سایت

فهرست مطالب:

نحوه ایجاد یک منوی عمودی برای یک وب سایت
نحوه ایجاد یک منوی عمودی برای یک وب سایت

تصویری: نحوه ایجاد یک منوی عمودی برای یک وب سایت

تصویری: نحوه ایجاد یک منوی عمودی برای یک وب سایت
تصویری: آموزش وردپرس: موارد لازم برای راه اندازی یک سایت 2024, آوریل
Anonim

منوی عمودی سایت عملکرد بسیار مناسبی است که به صرفه جویی در فضا و پیمایش آسان منابع کمک می کند. می توانید آن را بر اساس ورق های سبک CSS آبشاری یا با استفاده از ابزارهای خاص بسازید.

نحوه ایجاد یک منوی عمودی برای یک وب سایت
نحوه ایجاد یک منوی عمودی برای یک وب سایت

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

مرحله 1

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

گام 2

با استفاده از برگه Parameters ، قلم و رنگ منو را تنظیم کنید. می توانید یک قلم و اندازه آن را در قسمت Font انتخاب کنید. در صورت لزوم ، زیرخط / پررنگ را مشخص کنید. پس زمینه (پس زمینه) منوی عمودی را در قسمت Colors تنظیم کنید ، رنگ قلم و رنگ پس زمینه را روی شناور (fonthover / backgroundhover) تنظیم کنید.

مرحله 3

برای مدیریت موارد منو به منوی Items بروید. با کلیک بر روی دکمه پاک کردن ، نمونه موارد پاک می شود تا بتوانید موارد دلخواه خود را ایجاد کنید. کافی است روی کلید AddItem plus کلیک کنید تا موردی به انتهای منو اضافه شود. با استفاده از دکمه AddNextItem می توانید موردی را اضافه کنید که پس از زمان انتخاب شده فعلی دنبال شود. دکمه AddSubitem در منو یک مورد تو در تو برای مورد انتخاب شده ایجاد می کند. برای حذف یک خط ، از دکمه RemoveItem استفاده کنید.

مرحله 4

پارامترهای مورد (ItemParameters) را در پایین سایت باز کنید. یک نام برای مورد منو در خط متن و آدرس وب آن را در پیوند وارد کنید. خط نکته وظیفه توصیف مورد را نشان می دهد ، وقتی مکان نما روی پیوند قرار می گیرد. قسمت Target نحوه باز شدن صفحه را مشخص می کند. با پارامتر _elf ، می توان صفحه را تنظیم کرد تا در پنجره مرورگر فعلی باز شود.

مرحله 5

با کلیک بر روی دکمه بارگیری در پایین صفحه ، منوی آماده را بارگیری کنید. کد مربوطه را که در فایل purecssmenu.html قرار دارد در فایل الگوی CSS کپی کنید: در ابتدا و انتها. اطمینان حاصل کنید که کد صحیح را وارد کرده و فایل را ذخیره کنید.

توصیه شده: