პროგრამული უზრუნველყოფისა და ვებ – გვერდების შექმნის ერთ – ერთი ყველაზე მნიშვნელოვანი ასპექტია მენიუს შექმნა. Microsoft და მისი ყველაზე ცნობილი იდეა, Windows ოპერაციული სისტემა, უნდა იქნას მიღებული როგორც უმთავრესი მაგალითი. მიუხედავად იმისა, რომ ამ პროდუქტს მსოფლიოში კომპიუტერების მომხმარებელთა დიდი უმრავლესობა იყენებს, კრიტიკა არა მხოლოდ არ მცირდება, არამედ მუდმივად იზრდება. ძირითადად, ეს ეხება მენიუს ელემენტების ადგილმდებარეობის უხერხულობას. ქვემოთ მოცემულია აღწერა, თუ როგორ უნდა შექმნათ მენიუები CSS და Expression Web- ში.
ინსტრუქციები
Ნაბიჯი 1
ჰორიზონტალური მენიუს შექმნის დასაწყებად გადადით სტილის მართვაზე, შემდეგ კი დააჭირეთ ღილაკს ახალი სტილი. დაასახელეთ ახალი სტილის არჩევა ul li. Მნიშვნელოვანი! დარწმუნდით, რომ გენერირებულ ფაილს აქვს ჩამოსაშლელი.css გაფართოება. ჰორიზონტალური მენიუს შესაქმნელად მიუთითეთ შექმნილ ელემენტზე, რომ ის ზუსტად ჰორიზონტალური იქნება. შემდეგ, განსაზღვრეთ მენიუს თითოეული ელემენტის სიგანე და წაშალეთ ყველა ზედმეტი წერტილი, რომელიც განთავსებულია სიის ყველა პუნქტის წინ.
ნაბიჯი 2
გადადით განლაგების ვარიანტზე, დააყენეთ Display ატრიბუტი Inline– ზე ჰორიზონტალური გასწორების გასაკეთებლად. შემდეგ დააყენეთ მარცხენა მნიშვნელობა Float ატრიბუტზე და დააჭირეთ ღილაკს მიმართვა. სიის ყველა ერთეული დააყენეთ ერთ ხაზზე. ისე, რომ ისინი ლამაზად მოთავსდნენ და ერთმანეთზე არ გადაიტანონ, ატრიბუტის სიგანე, დააყენეთ პოზიციის მნიშვნელობა 150 px. შეამოწმეთ სიის ყველა ელემენტის იგივე ზომა. შემდეგ, ამოიღეთ წერტილები ყველა ელემენტის წინ - ამისათვის გადადით ატრიბუტის სიაში და დააყენეთ None პარამეტრი ჩამონათვალის სტილის ტიპის ელემენტში. დააჭირეთ ღილაკს OK, რომ ყველა ცვლილება იყოს მიღებული და გამოყენებული.
ნაბიჯი 3
შრიფტის ზომა და სტილი შეცვალეთ ul li. ამისათვის გადადით სტილის მართვაზე და დააწკაპუნეთ ღილაკზე მარჯვენა ღილაკი, შემდეგ აირჩიეთ სტილის შეცვლა. გამოჩნდება ნაცნობი დიალოგური ფანჯარა. გადადით შრიფტზე, აირჩიეთ Font-family ატრიბუტი და დააყენეთ Sans-serif, Arial, Helvetica. შემდეგ შეცვალეთ შრიფტის ზომა 0, 9 – ზე დაყენებით. ამის შემდეგ დააყენეთ Text-transform ატრიბუტი ზედაზე. შეცვალეთ მენიუს ელემენტების სიმაღლე ატრიბუტში სიმაღლე - პოზიცია, დააყენეთ მნიშვნელობა 30 პიქსელზე.
ნაბიჯი 4
ყველა მაკორექტირებელი მოქმედების დასრულების შემდეგ, შეინახეთ ფაილი menu.html. შემდეგ, შეამოწმეთ შექმნილი მენიუ სხვადასხვა ბრაუზერებში, რომ დარწმუნდეთ, რომ ის სწორად მუშაობს. როგორც ხედავთ, ჰორიზონტალური მენიუს დიზაინი საკმაოდ მარტივია.
