Muestra las diferencias entre dos versiones de la página.
| Ambos lados, revisión anterior Revisión previa Próxima revisión | Revisión previa | ||
|
wiki2:html_css [2021/05/06 17:20] alfred [SVG] |
wiki2:html_css [2022/06/06 13:12] (actual) |
||
|---|---|---|---|
| Línea 142: | Línea 142: | ||
| ===== SVG ===== | ===== SVG ===== | ||
| - | Add an svg: | + | ==== Using img tag ==== |
| + | <code> | ||
| + | <img src = "happy.svg" alt="My Happy SVG"/> | ||
| + | </code> | ||
| + | |||
| + | ==== Using object tag ==== | ||
| + | <code> | ||
| + | <object data="happy.svg" width="300" height="300"> </object> | ||
| + | </code> | ||
| + | |||
| + | ==== Add an svg with code directly ==== | ||
| + | |||
| + | <code> | ||
| + | <svg width="100" height="100"> | ||
| + | <circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" /> | ||
| + | </svg> | ||
| + | </code> | ||
| + | |||
| + | ==== Using a file ==== | ||
| + | It comes from: https://github.com/feathericons/feather#svg-sprite= | ||
| <code> | <code> | ||
| <svg | <svg | ||
| Línea 153: | Línea 173: | ||
| stroke-linejoin="round" | stroke-linejoin="round" | ||
| > | > | ||
| - | <use xlink:href="path/to/feather-sprite.svg#circle"/> | + | <use href="path/to/feather-sprite.svg#circle"/> |
| </svg> | </svg> | ||
| </code> | </code> | ||
| + | ==== From a reference in code ==== | ||
| + | |||
| <code> | <code> | ||