Როგორ გავიგოთ Viewbox ატრიბუტი SVG- ში

ვებ დიზაინი სახელმძღვანელო "SVG" Viewbox- ის გამოყენებით (HTML)

Viewbox არის SVG- ის ფორმის შექმნისას გამოყენებული ატრიბუტი. თუ ფიქრობთ დოკუმენტი ტილოზე, ხედი ყუთი არის ტიპების ნაწილი, რომლის ნახვის სურვილიც გსურთ. მიუხედავად იმისა, რომ გვერდი შეიძლება დაფაროს მთელი კომპიუტერი ეკრანზე, ფიგურა შეიძლება მხოლოდ არსებობს მესამე მესამედი.

Viewbox იძლევა საშუალებას, რომ მესმის, რომ მესამე მხარეს დააშოროთ. იგი გამორიცხავს დამატებით თეთრ სივრცეს. დაფიქრდით ყუთში, როგორც ვირტუალური მიდგომა მოსავლის იმიჯი.

ამის გარეშე, თქვენი გრაფიკული გამოჩნდება მისი რეალური ზოდის მესამედი.

Viewbox ღირებულებები

სურათის მოსავლად, სურათზე უნდა შეიმუშაოთ ქულები. იგივე შეესაბამება სურათის ატრიბუტის ხილვას. ნახვების ყუთისთვის ღირებულების პარამეტრებია:

სინტაქსი ხედი მნიშვნელობისთვის არის:

viewBox = "0 0 200 150"

არ აღრეული სიგანე და სიმაღლე ხედი ყუთი სიგანე და სიმაღლე თქვენ მითითებული SVG დოკუმენტი. SVG ფაილის შექმნისას თქვენ შექმნილ ერთ-ერთ პირველ ღირებულებას წარმოადგენს დოკუმენტის სიგანე და სიმაღლე. დოკუმენტი ტილოა. ხედი ყუთი შეიძლება დაფაროს მთელი ტილო ან უბრალოდ ნაწილი.

ეს ხედი მოიცავს მთელ გვერდს.

ეს ნახატი მოიცავს ნახევარ გვერდზე ზედა მარჯვენა კუთხეში.

შენი ფორმის ასევე აქვს სიმაღლე და სიგანე დავალებები.


ეს არის დოკუმენტი, რომელიც მოიცავს 800 x 400 px ნახატს, რომელიც იწყება ზედა მარჯვენა კუთხეში და გვერდის ნახევარი აფართოებს. ფორმის არის ოთხკუთხედი, რომელიც იწყება სურათის ზედა მარჯვენა კუთხეში და მოძრაობს 100 px მარცხნივ და 50 px ქვემოთ.

რატომ შეიტანეთ Viewbox?

SVG აკეთებს ბევრად უფრო მეტია, ვიდრე უბრალოდ მიაპყროს ფორმა. მას შეუძლია შექმნას ერთი ფიგურა თავზე კიდევ ერთი ჩრდილი ეფექტი. მას შეუძლია შეცვალოს ფორმის ისე, რომ იგი ერთ მიმართულებით შეედრება. მოწინავე ფილტრებისთვის, თქვენ უნდა გაიგოთ და გამოიყენოთ ნახვის ყუთში ატრიბუტი.