2013-12-10 5 views
0

Я пытаюсь изменить размер svg на точный размер, который я хочу (32x32). Посмотрите на пример на http://jsfiddle.net/Uy94k/6/Изменение размера SVG до определенных размеров

Это скрипку короткий вентиляционных большего файла .svg который я включить в мой файл HTML и refeer, к которому изображение, которое я хочу с помощью:

<svg class="small" viewBox="0 0 512 512" preserveAspectRatio="none"> 
    <g filter=""> 
     <use xlink:href="#login"></use> 
    </g> 
</svg> 

(Любой простой способ сделать это, кстати?).

Как вы можете видеть, я попытался использовать preserveAspectRatio, но не повезло. Я также пробовал различные методы стилизации (т. Е. Размер в тегах span вне svn, стиль в тегах svn, играющий с высотой как внутри, так и где я называю это идентификатором.).

Если вы используете инструмент разработчика для просмотра высоты/ширины изображений в скрипке, вы увидите, что это 26x20 .. Но почему это?

+0

Я вижу изображения как 32x32 ... Использование Chrome на Win7 ** EDIT ** Nevermind, теперь я вижу, что тэг 'svg' - 32x32, но« путь »- 26x20. –

+0

. Вот ссылка, описывающая как они изменили размеры. Они использовали svg в качестве фонового изображения. Надеюсь, поможет! [Здесь] (https://developer.mozilla.org/en-US/docs/Web/CSS/Scaling_of_SVG_backgrounds#Specifying_fixed_lengths_for_both_dimensions) –

+0

Но как я могу использовать их в качестве фоновых изображений, когда мне нужно «расслоить» их в один файл svg и фальсифицировать их с id? – xeor

ответ

0

Tweeking значения viewBox (угадывая значение viewBox="120 70 340 340" в этом случае) kinda сделал трюк. Но это склонность к ошибкам, не очень хорошая и утомительная для подбора параметров. Посмотрите на пример на http://jsfiddle.net/veZSX/1/ для tweeked vs untveeked версии. Должен быть лучший способ?

+0

Если я открываю svg в inkscape и нажимаю путь, на который я хочу видеть окно, inkscape отображает его для выбранного элемента! Я могу просто «украсть» правильный viewbox из inkscape. Последние 2 параметра в окне просмотра должны быть округлены до ближайшего целого числа, а не вниз. – xeor

Смежные вопросы