SVG метка

SVG — векторная графика для сайтов

SVG (Scalable Vector Graphics) — фор­мат век­тор­ной гра­фи­ки, кото­рый поз­во­ля­ет созда­вать икон­ки, лого­ти­пы, иллю­стра­ции и ани­ма­ции без поте­ри каче­ства при мас­шта­би­ро­ва­нии. Изоб­ра­же­ния опи­сы­ва­ют­ся с помо­щью XML-раз­мет­ки: их мож­но редак­ти­ро­вать в гра­фи­че­ском редак­то­ре или коде, сти­ли­зо­вать через CSS и делать интер­ак­тив­ны­ми с помо­щью JavaScript.

Работа с СВГ на практике

В мате­ри­а­лах по мет­ке SVG раз­би­ра­ем устрой­ство фор­ма­та, рабо­ту с кон­ту­ра­ми path, фигу­ра­ми, залив­ка­ми, гра­ди­ен­та­ми и мас­ка­ми. Рас­смат­ри­ва­ем спо­со­бы встра­и­ва­ния SVG в HTML, настрой­ку раз­ме­ров через viewBox, опти­ми­за­цию фай­лов и созда­ние ани­ма­ции. Прак­ти­че­ские при­ме­ры помо­га­ют разо­брать­ся в раз­мет­ке и исполь­зо­вать век­тор­ную гра­фи­ку в веб-про­ек­тах, в том чис­ле на сай­тах WordPress.