Tengo otra pregunta sin duda tonta, con la que esperaba obtener ayuda. Tradicionalmente vengo de un entorno más de medios impresos, pero actualmente estoy intentando construir mi sitio web a través de WordPress y me he encontrado con algunos problemas. El principal está tratando de usar el archivo .svg en mi sitio web.
Instalé el complemento "SVG Support", que me permite cargar los archivos; sin embargo, mi problema ha sido definir el tamaño del archivo cuando se muestra. Me doy cuenta de que un archivo svg no es un archivo de imagen, es un documento, y hacer que tenga un tamaño determinado en Illustrator realmente no importa, ya que es un vector, no una trama, y se escalará bien. Pero estoy tratando de averiguar cómo defino el tamaño en el que quiero que se muestre el archivo en la página web.
Me he hundido en una profunda y oscura madriguera de artículo tras artículo, confundiéndome completamente en el proceso. Algunos artículos han sugerido algún código css, esto no parece funcionar para mí (aunque podría haberlo hecho mal). Sin embargo, por lo que puedo deducir, la mayoría de los artículos parecen sugerir descargar un programa llamado "Inkscape" y definir el tamaño del archivo en un 'cuadro de visualización'. Y yo estoy como "¿Qué diablos es un viewbox?" ¿Y esto es algo que podría hacer solo en Illustrator? jajaja
Al final del día, todo lo que quiero es tener gráficos .svg que se escalen en proporción. ¿Alguien tiene alguna sugerencia sobre cómo utilizan los archivos .svg en su sitio web? Gracias por su tiempo, agradezco la ayuda.
Para mantenerlo simple, puede cargar los archivos .svg en wordpress e incluirlos en su código html al igual que otros formatos de imagen como:
<img src="img/demo.svg" width="200" height="200">
O
<img src="img/demo.svg" style="width: 200px; height: 200px;">
O
<img src="img/demo.svg" class="demo">
.demo{
width:200px;
height: 200px;
}
un poco de ayuda desde aquí: https://css-tricks.com/using-svg/
Además, puede usar los archivos svg como un sprite svg: https://css-tricks.com/svg-sprites-use-better-icon-fonts/
Lucas
Caí
<img>o incluyendo el<svg>código directamente?