Sertifikat olingYANGIW3Schools ilovasiiOS va AndroidSarguzashtni boshlang

SVG bilan tanishuv

ULASHISH

SVG’ni o‘rganing

SVG — Scalable Vector Graphics (masshtablanuvchan vektor grafikasi) degan ma’noni anglatadi.

SVG vektor asosidagi grafikani XML formatida belgilaydi.

SVG grafikasi masshtablanuvchan bo‘lib, kattalashtirilganda yoki o‘lchami o‘zgartirilganda sifatini mutlaqo yo‘qotmaydi.

SVG barcha asosiy brauzerlarda qo‘llab-quvvatlanadi.

Har bir bobda misollar

"O‘zingiz sinab ko‘ring" muharririmiz yordamida SVG kodini tahrirlab, natijani ko‘rish uchun tugmani bosishingiz mumkin.

SVG misoli

<html> <body> <h1>My first SVG</h1> <svg width="100" height="100" xmlns="http://www.w3.org/2000/svg">   <circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" /> </svg> </body> </html>
O‘zingiz sinab ko‘ring »

Oldindan nimalarni bilishingiz kerak

Davom etishdan oldin quyidagilar haqida boshlang‘ich tushunchaga ega bo‘lishingiz kerak:

  • HTML
  • XML asoslari

Agar avval shu mavzularni o‘rganmoqchi bo‘lsangiz, tegishli darsliklarni Bosh sahifamizda topasiz.

SVG nima?

  • SVG — Scalable Vector Graphics (masshtablanuvchan vektor grafikasi) degan ma’noni anglatadi
  • SVG veb uchun vektor asosidagi grafikani belgilashda ishlatiladi
  • SVG grafikani XML formatida belgilaydi
  • SVG fayllaridagi har bir element va atributni animatsiya qilish mumkin
  • SVG — W3C tavsiyasi (standarti)
  • SVG CSS, DOM, XSL va JavaScript kabi boshqa standartlar bilan integratsiyalashadi

SVG — W3C tavsiyasi

SVG 1.0 2001-yil 4-sentabrda W3C tavsiyasiga aylandi.

SVG 1.1 2003-yil 14-yanvarda W3C tavsiyasiga aylandi.

SVG 1.1 (ikkinchi nashr) 2011-yil 16-avgustda W3C tavsiyasiga aylandi.

SVG’ning afzalliklari

SVG’ning boshqa rasm formatlari (masalan, JPEG va GIF) oldidagi afzalliklari:

  • SVG rasmlarini istalgan matn muharririda yaratish va tahrirlash mumkin
  • SVG rasmlarini qidirish, indekslash, skriptlar bilan boshqarish va siqish mumkin
  • SVG rasmlari masshtablanuvchan
  • SVG rasmlarini istalgan o‘lchamda (resolution) yuqori sifatda chop etish mumkin
  • SVG rasmlarini kattalashtirish mumkin
  • SVG grafikasi kattalashtirilganda yoki o‘lchami o‘zgartirilganda sifatini mutlaqo YO‘QOTMAYDI
  • SVG — ochiq standart
  • SVG fayllari sof XML’dan iborat

U qanday ishlaydi?

SVG’da to‘rtburchaklar, aylanalar, ellipslar, chiziqlar, ko‘pburchaklar, egri chiziqlar va boshqalar uchun elementlar hamda atributlar mavjud.

SVG shuningdek filtr va xiralashtirish effektlari, gradientlar, aylantirishlar, animatsiyalar, JavaScript bilan interaktivlik va boshqa imkoniyatlarni qo‘llab-quvvatlaydi.

Oddiy SVG hujjati <svg> ildiz elementidan va birgalikda grafikani hosil qiladigan bir nechta asosiy shakl elementlaridan iborat bo‘ladi.

SVG rasmlarini yaratish

SVG rasmlarini istalgan matn muharririda yoki Inkscape kabi chizish dasturida yaratish mumkin.

SVG tushunchasi va asoslarini o‘rganishingiz uchun ushbu darslikda SVG faqat oddiy matn orqali o‘rgatiladi.

Keyingi sahifada SVG rasmini to‘g‘ridan-to‘g‘ri HTML sahifaga qanday joylashtirish ko‘rsatiladi!


‹ OrqagaKeyingisi

W3Schools Pathfinder

Yutuqlaringizni kuzating – bu bepul!

Ro'yxatdan o'tishKirish