Вот SVG изображение. В нем я пытаюсь уменьшить ширину
Сниппет:
Ответ
Из вопроса непонятно, какую ширину вы хотите уменьшить:
Уменьшить ширину самой фигуры, но насколько уменьшить не ясно.
Уменьшить ширину места, которое занимает svg внутри HTML?
Если первый вариант, то необходимо в векторном редакторе перерисовать фигуру нужной ширины и длины. Для этого откройте векторный редактор, установите размер документа близкий по размерам нужной вам фигуры и в границах этого документа нарисуйте нужную фигуру, стараясь оставлять минимальные отступы от границ документа. Фигура очень простая и это будет вам не трудно.
Если это второй вариант,- вы не хотите перерисовывать фигуру, но вам надо уменьшить слишком большие отступы от фигуры до краев SVG, то можно воспользоваться следующей техникой:
Вот ваш SVG, красная рамка показывает границы svg документа.
Она добавлена стилями: style="border:1px solid red;"
Видно, что присутствуют очень большие отступы от фигуры до краев svg документа. Какого размера красная рамка, столько места svg займет в HTML. И никакие ухищрения в CSS не помогут уменьшить эти отступы. Уменьшать эти отступы нужно прямо в SVG. Для этого добавим viewport это width height в шапке svg файла. Если вам нужно адаптивное изображение, то ширину и высоту необходимо указывать в процентах.
Для уменьшения отступов меняем соотношение сторон,- делаем высоту в 8 раз меньше
376 /8 = 47px Точно такая же пропорция должна быть
у viewport,- width="100" height="12.5%"
В частности, если хотите сделать более узкий полигон поднимите его этой командой вверх.
Комментариев нет:
Отправить комментарий