Ինչպես հասկանալ Viewbox- ի հատկանիշը SVG- ում

Վեբ դիզայնի ուղեցույց `« SVG »դիտարկչի օգտագործման (HTML)

Viewbox- ը SVG- ի ձեւերը ստեղծելու ժամանակ սովորաբար օգտագործվում է հատկանիշ: Եթե ​​կարծում եք, որ փաստաթուղթը որպես կտավ է, ապա տեսք արկղը կտավի մասն է, որը ցանկանում եք դիտողին տեսնել: Թեեւ էջը կարող է ընդգրկել ամբողջ համակարգչի էկրանը, այդ թիվը կարող է գոյություն ունենալ միայն ողջ երրորդում:

Viewbox- ն թույլ է տալիս զրուցակցին ասել, որ երրորդ տեղում է մեծացնել: Այն վերացնում է լրացուցիչ սպիտակ տարածքը: Մտածեք տեսքի արկղը որպես վիրտուալ մոտեցում, որը բերում է պատկեր:

Առանց դրա, ձեր գրաֆիկան կհայտնվի իր իրական չափի երրորդ մասը:

Viewbox արժեքները

Պատկերը քանդելու համար դուք պետք է ստեղծեք պատկերների նկարները կրճատումներ կատարելու համար: Նույնը ճիշտ է, երբ օգտագործելով տեսադաշտի տուփի հատկանիշը: Տեսանկյունի արժեքի կարգավորումները ներառում են `

Տեսանելի տուփի արժեքների շարադրանքը հետեւյալն է.

viewBox = "0 0 200 150"

Մի շփոթեք տեսքի վանդակի լայնությունը եւ բարձրությունը SVG փաստաթղթի համար սահմանված լայնության եւ բարձրության հետ: Երբ դուք ստեղծում եք SVG ֆայլ, ձեր ստեղծած առաջին արժեքներից մեկը փաստաթղթի լայնությունն է եւ բարձրությունը: Փաստաթուղթը կտավ է: Տեսքային տուփը կարող է ընդգրկել ամբողջ կտավը կամ ընդամենը մի մասը:

Այս դիտակետը ընդգրկում է ամբողջ էջը:

Այս դիտակետը ներառում է վերին աջ անկյունում սկսվող կես էջը:

Ձեր ձեւը նույնպես ունի բարձրությունը եւ լայնությունը:


Դա մի փաստաթուղթ է, որը ներառում է 800 x 400 px տեսքով, որը սկսվում է վերին աջ անկյունում եւ ընդլայնում է էջի կեսը: Ձեւը մի ուղղանկյուն է, որը սկսվում է տեսքի վանդակի վերին աջ անկյունում եւ շարժվում է 100 px ձախ եւ 50 px անկում:

Ինչու ստեղծել Դիտել Փոստ:

SVG- ն ավելին է անում, քան պարզապես ձեւավորել: Այն կարող է ստեղծել մեկ գործիչ, մյուսի գույնի ստվերային ազդեցության համար: Այն կարող է փոխել ձեւը այնպես, որ այն ուղղվի մեկ ուղղությամբ: Ընդլայնված ֆիլտրերի համար դուք պետք է հասկանաք եւ օգտագործեք տեսադաշտի տուփի հատկանիշը: