نحوه تهیه یک منوی افقی

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

مرحله 1

به Manage Styles رفته و سپس دکمه New Style را کلیک کنید. به سبک جدیدی که تازه ایجاد کرده اید ، نام Selector ul li را بگذارید. همچنین فراموش نکنید که سبک جدید باید در پرونده کشویی.css تعریف شود.

گام 2

برای کشیدن یک منوی افقی ، باید به موارد منو بگویید که افقی خواهد بود. بعد ، باید عرض هر مورد از فهرست را تعیین کنید و تمام نقاط غیرضروری را در مقابل همه موارد لیست حذف کنید.

مرحله 3

برای تراز بندی افقی به Layout رفته و ویژگی نمایش را به صورت درون خطی تنظیم کنید. ویژگی float را به سمت چپ تنظیم کنید. روی دکمه اعمال کلیک کنید. همه موارد لیست باید در یک خط تنظیم شوند. برای اینکه یکدیگر تداخل نداشته باشند ، باید موارد زیر را انجام دهید: مقدار Position ویژگی عرض را روی 150px تنظیم کنید. اکنون آن را بررسی کنید. همه عناصر لیست باید به یک اندازه باشند.

مرحله 4

اکنون باید سعی کنیم نقاط جلوی آیتم های لیست را حذف کنیم. برای انجام این کار ، به لیست رفته و ویژگی list-style –type را به هیچ تنظیم کنید.

مرحله 5

برای پذیرش همه تغییرات ، تأیید را کلیک کنید.

مرحله 6

برای تنظیم اندازه قلم برای سبک ul li ، باید موارد زیر را انجام دهید. در Manage Styles ، بر روی سبک ul li که برای انتخاب Modify Style نیاز دارید ، کلیک راست کنید. کادر گفتگوی آشنا برای افزودن یا تغییر ویژگی ها باز می شود. به دسته Font بروید و ویژگی font-family را به Arial ، Helvetica ، sans-serif تنظیم کنید. بعد ، به ویژگی font-size بروید و آن را روی 0.9em تنظیم کنید. بعد از آن ، ویژگی text-transform را تنظیم کنید ، مقدار آن را به بزرگ بنویسید.

مرحله 7

ارتفاع موارد موجود در منوی ایجاد شده را می توان در گروه Position تنظیم کرد. ویژگی ارتفاع را روی 30px تنظیم کنید.

مرحله 8

در مرحله بعدی ، باید فایل menu.html را ذخیره کنید. برای این کار ، Expression Web پنجره مورد نیاز Save Embedded Files را برای ذخیره پرونده باز می کند. ذخیره در پرونده کشویی. css. برای ذخیره روی تأیید کلیک کنید.

مرحله 9

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