Вопросы с тегом «svg»

Масштабируемая векторная графика (SVG) - это формат двумерной векторной графики на основе XML, который также можно использовать в HTML. Не добавляйте этот тег только потому, что ваш проект использует SVG. Вместо этого добавьте тег, если ваш вопрос касается либо SVG, либо тесно связан с ним, например, как добиться чего-то с помощью SVG.

603
Использовать ли <img>, <object> или <embed> для файлов SVG?

Должен ли я использовать <img>, <object>или <embed>для загрузки файлов SVG на страницу таким образом , похоже на выгрузку jpg, gifили png? Какой код для каждого, чтобы он работал как можно лучше? (Я вижу ссылки на включение mimetype или указание на запасные рендеры SVG в моих...

575
Каковы различные варианты использования PNG против GIF против JPEG против SVG?

Когда следует использовать определенные типы файлов изображений при создании веб-сайтов или интерфейсов и т. Д.? Каковы их сильные и слабые стороны? Я знаю, что PNG & GIF без потерь, а JPEG с потерями. Но в чем главное отличие PNG и GIF? Почему я должен предпочесть одно другому? Что такое SVG и...

476
HTML5 Canvas против SVG против div

Каков наилучший подход для создания элементов на лету и возможности их перемещения? Например, допустим, я хочу создать прямоугольник, круг и многоугольник, а затем выбрать эти объекты и переместить их. Я понимаю, что HTML5 предоставляет три элемента, которые могут сделать это возможным: svg ,...

437
Как изменить цвет изображения SVG с помощью CSS (замена изображения jQuery SVG)?

На этот вопрос есть ответы на Stack Overflow на русском Это самостоятельные вопросы и ответы о полезном куске кода, который я придумал. В настоящее время нет простого способа внедрить изображение SVG, а затем получить доступ к элементам SVG через CSS. Существуют различные способы использования...

389
Как конвертировать SVG в PNG с помощью ImageMagick?

У меня есть файл SVG, который имеет определенный размер 16x16. Когда я использую программу преобразования ImageMagick для преобразования ее в PNG, я получаю PNG размером 16x16 пикселей, который слишком мал: convert test.svg test.png Мне нужно указать размер пикселя выходного PNG. -sizeПараметр,...

379
SVG Drop Shadow с использованием CSS3

Можно ли установить тень для элемента SVG с помощью CSS3, что-то вроде box-shadow: -5px -5px 5px #888; -webkit-box-shadow: -5px -5px 5px #888; Я видел некоторые замечания по созданию тени с использованием эффектов фильтра. Есть ли пример использования только CSS? Ниже приведен рабочий код, в...

376
Обнаружить iPad Mini в HTML5

IPad Mini от Apple - меньший клон iPad 2 во многих отношениях, чем хотелось бы. В JavaScript window.navigatorобъект предоставляет одинаковые значения для Mini и iPad 2. Мои тесты, которые пока не выявили разницу, не привели к успеху. Почему это важно? Поскольку экраны iPad Mini и iPad 2 идентичны...

375
img src SVG: изменение стилей с помощью CSS

HTML <img src="logo.svg" alt="Logo" class="logo-img"> CSS .logo-img path { fill: #000; } Приведенный выше svg загружается и изначально, fill: #fffно когда я использую приведенное выше, cssчтобы попытаться изменить его на черный, он не меняется, я впервые играю с SVG, и я не уверен, почему он...

352
Как изменить цвет элемента SVG?

Я хочу использовать эту технику http://css-tricks.com/svg-fallbacks/ и изменить цвет SVG, но до сих пор я не смог этого сделать. Я положил это в CSS, но мое изображение всегда черное, несмотря ни на что. Мой код: .change-my-color { fill: green; } <svg> <image class="change-my-color"...

289
jQuery SVG, почему я не могу добавить класс?

Я использую jQuery SVG. Я не могу добавить или удалить класс для объекта. Кто-нибудь знает мою ошибку? SVG: <rect class="jimmy" id="p5" x="200" y="200" width="100" height="100" /> JQuery, который не добавляет класс: $(".jimmy").click(function() { $(this).addClass("clicked"); }); Я знаю, что...

285
Встроенный SVG в CSS

Можно ли использовать встроенное определение SVG в CSS? Я имею в виду что-то вроде: .my-class { background-image: <svg>...</svg>; }

270
Изменить цвет заливки SVG, когда он используется в качестве фонового изображения

Помещая вывод SVG прямо в линию с кодом страницы, я могу просто изменить цвета заливки с помощью CSS следующим образом: polygon.mystar { fill: blue; }​ circle.mycircle { fill: green; } Это прекрасно работает, однако я ищу способ изменить атрибут "fill" SVG, когда он используется как...

266
Как преобразовать изображение PNG в SVG? [закрыто]

Закрыто . Этот вопрос должен быть более сфокусированным . В настоящее время он не принимает ответы. Закрыто 4 года назад . Locked . Этот вопрос и его ответы заблокированы, потому что вопрос не по теме, но имеет историческое значение. В настоящее время он не принимает новые ответы или...

254
Как мне центрировать SVG в div?

У меня есть SVG, который я пытаюсь центрировать в div. Div имеет ширину или 900px. SVG имеет ширину 400 пикселей. Для SVG поля margin-left и margin-right установлены на auto. Не работает, просто действует так, как будто левое поле равно 0 (по умолчанию). Кто-нибудь знает мою...

254
JQuery SVG против Рафаэля [закрыто]

Закрыто . Этот вопрос основан на мнении . В настоящее время он не принимает ответы. Хотите улучшить этот вопрос? Обновите вопрос, чтобы ответить на него фактами и цитатами, отредактировав этот пост . Закрыто 6 лет назад . Улучшить этот вопрос Я работаю над интерактивным интерфейсом, используя SVG...

246
Есть ли способ использовать SVG в качестве контента в псевдоэлементе: before или: after

Я хочу разместить изображения SVG перед выбранными элементами. Я использую jQuery, но это не имеет значения. Я хотел бы, чтобы :beforeэлемент был как: #mydiv:before { content: '<svg.. code here</svg>'; display: block; width: 22px; height: 10px; margin: 10px 5px 0 10px; } Если я сделаю это,...

236
Как я могу сделать масштаб SVG с его родительским контейнером?

Я хочу иметь встроенную шкалу содержимого элемента SVG, когда размер не является родным. Конечно, я мог бы иметь его как отдельный файл и так масштабировать. index.html: <img src="foo.svg" style="width: 100%;" /> foo.svg: <svg width="123" height="456"></svg> Тем не менее, я хочу...

223
Как создать слезу в HTML?

Как мне создать такую ​​фигуру для отображения на веб-странице? Я не хочу использовать изображения, так как они будут размыты при масштабировании Я попробовал с CSS : .tear { display: inline-block; transform: rotate(-30deg); border: 5px solid green; width: 50px; height: 100px;...