Что такое SVG?
Этот вопрос проверяет понимание технологии SVG для работы с векторной графикой и её преимуществ по сравнению с растровыми изображениями, а также возможностей для анимации и интерактивности.
Короткий ответ
SVG (Scalable Vector Graphics) — это формат векторной графики, который позволяет отображать изображения, масштабируемые без потери качества. SVG используется для создания логотипов, иконок, диаграмм и других графических элементов, которые остаются четкими при любом разрешении. Элементы SVG можно анимировать и управлять ими через CSS и JavaScript.
Длинный ответ
SVG (Scalable Vector Graphics) — это XML-формат для создания двухмерной векторной графики, который поддерживается всеми современными браузерами. В отличие от растровой графики (например, PNG или JPEG), SVG хранит информацию об объектах в виде геометрических фигур (линий, кругов, многоугольников), что позволяет масштабировать изображения без потери качества. Это делает SVG идеальным для логотипов, иконок и других графических элементов, которые должны выглядеть четко на устройствах с разными разрешениями.
Пример использования:
<svg width="100" height="100">
<circle cx="50" cy="50" r="40" stroke="black" stroke-width="2" fill="red" />
</svg>Этот код создает красный круг с черной рамкой. SVG поддерживает не только простые фигуры, но и текст, сложные пути и трансформации. Кроме того, SVG элементы можно стилизовать и анимировать с помощью CSS и управлять ими через JavaScript.
SVG активно используется для создания интерактивных элементов на веб-страницах, таких как графики, схемы или интерактивные карты. В отличие от <canvas>, SVG является частью DOM, поэтому каждый элемент можно манипулировать так же, как и другими HTML элементами.