Курсы javascript
Всем привет!
Есть блок с svg, там прописан путь path. В данном случае это контур Крыма.
Как растянуть Крым в svg на всю ширину и длину блока div?
Вот что требуется. Думаю так нагляднее будет:
04.08.2020, 03:01
Регистрация: 14.01.2015
Сообщений: 12,990
Вы его воткнули в документ маленькой крохой и пытаетесь масштабировать, забывая о том, что он в рамках объекта.
.box < width: 600px; border: 1px solid red; >.box svg
Здесь документ имеет размер svg (изменено) и масштабирование посредством css по родителю.
Последний раз редактировалось laimas, 04.08.2020 в 04:47 .
Как растянуть SVG по ширине при этом сохранив высоту?
В общем SVG элементы ведут себя как картинки (img) они масштабируется пропорционально.
Вопрос в том, можно ли как-то изменять только ширину при этом высоту сохранять по умолчанию.
Вот пример, если масштабировать область с красным прямоугольником, можно наблюдать как он изменятся в размерах, но меняется как ширина так и высота.
- Вопрос задан более трёх лет назад
- 10733 просмотра
Как растянуть svg изображение в before на всю ширину экран?
Есть блок у него есть декоративный элемент в виде волнистого изображения
мне нужно чтоб она всегда была на всю ширину экрана но у svg в коде есть определенная ширина и из-за этого картинка становиться или в левый или в правый край и все и не растягивается на всю ширину я пробовал ставить 100% svg но нечего не получалось ставил 100% befor нечего не работает
Как мне решить это ?
.creating < position: relative; background: linear-gradient(180deg, #FFF7E0 0%, #FFFFFF 100%); min-height: 200px; width: 100%; max-width: 100%; >.creating::before < content: url(../images/creating-before.svg); position: absolute; top: -200px; right: 0; >- Вопрос задан 02 мая 2023
- 118 просмотров
Комментировать
Решения вопроса 1
Ankhena @Ankhena Куратор тега CSS
Нежно люблю верстку
но у svg в коде есть определенная ширина и из-за этого картинка становиться или в левый или в правый край
Ну не из-за этого, а из-за того, что по умолчанию, svg не меняет пропорции.
Но это меняется с помощью атрибута preserveAspectRatio
Ответ написан 02 мая 2023
Как растянуть SVG всю ширину блока?
Как сделать, чтобы лого было шириной 250 и высотой 100%? т.е. во весь блок.
Если выбрать GIF лого — оно само растягивается. SVG же автоматом уменьшается визуально.
как я понял, надо что-то в самом свг поправить:
version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 1407.9 938.4" style="enable-background:new 0 0 1407.9 938.4;" xml:space="preserve">
Пробовал менять preserve на default, но не сработало
Может тут что-то еще надо поменять?
Изменено 24 января 2022 пользователем nikki4