SVG <color sólido> Elemento

SVG significa Gráfico vectorial escalable. Se puede utilizar para hacer gráficos y animaciones en estructura web HTML. El elemento <solidcolor> define un solo color en varios lugares para una entrada SVG. Define una paleta y permite que se use consistentemente a lo largo de un documento.

Sintaxis:

<solidColor />

Atributos: No tiene ningún atributo específico.

Ejemplo 1:

HTML

<!DOCTYPE html>
<html>
  
<body>
  
    <svg viewBox="0 0 200 200">
        <defs>
            <solidColor id="color" 
                solid-color="#a080ff" 
                solid-opacity="0.5" />
        </defs>
        <g>
            <rect fill="none" stroke="blue" 
                x="6" y="6" width="15" 
                height="15" />
  
            <rect fill="url(#color)" 
                stroke="black" stroke-width="2" 
                x="1" y="1" width="25" 
                height="25" />
        </g>
    </svg>
</body>
  
</html>

Producción:

Ejemplo 2:

HTML

<!DOCTYPE html>
<html>
  
<body>
    <svg viewBox="0 0 220 220">
        <defs>
            <solidColor id="MyLightPurple"
                solid-color="black" 
                solid-opacity="1" />
        </defs>
  
        <rect fill="url(#MyLightPurple)" 
            stroke="black" stroke-width="5" 
            x="6" y="6" width="20" 
            height="20" />
    </svg>
</body>
  
</html>

Producción:

Publicación traducida automáticamente

Artículo escrito por epistler_999 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *