Categoría: HTML-SVG

Propiedad SVG TextPathElement.startOffset

Posted on by Rudeus Greyrat

La propiedad SVG TextPathElement.startOffset devuelve un objeto SVGAnimatedLength correspondiente al atributo del elemento de ruta de texto dado. Sintaxis: TextPathElement.startOffset Valor devuelto: esta propiedad devuelve el objeto SVGAnimatedLength que se puede usar para obtener el startOffset del elemento TextPath. Ejemplo 1: HTML <!DOCTYPE html>  <html>    <body>     <svg viewBox=»0 0 200 500″         xmlns=»http://www.w3.org/2000/svg»>             <path … Continue reading «Propiedad SVG TextPathElement.startOffset»

Atributo de eventos de puntero SVG

Posted on by Rudeus Greyrat

El atributo pointer-events nos permite definir si un elemento puede ser el objetivo de un evento del mouse o cuándo. Se aplica a los siguientes elementos: <a>, <circle>, <clipPath>, <defs>, <elipse>, <foreignObject>, <g>, <image>, <line>, <marker>, <mask >, <ruta>, <patrón>, <polígono>, <polilínea>, <rect>, <svg>, <interruptor>, <símbolo>, <texto>, <textPath>, <tspan>, <use>. Sintaxis: pointer-events = bounding-box | … Continue reading «Atributo de eventos de puntero SVG»

Efectos de desenfoque SVG

Posted on by Rudeus Greyrat

El elemento SVG <feGaussianBlur> se utiliza para crear efectos de desenfoque: Sintaxis: <feGaussianBlur in=»SourceGraphic» stdDeviation=»5″ /> Atributos: in: se utiliza para identificar la entrada para la primitiva de filtro dada. stdDeviation: se utiliza para definir la desviación estándar para la operación de desenfoque. edgeMode: se utiliza para determinar cómo extender la imagen de entrada según … Continue reading «Efectos de desenfoque SVG»

Atributo de estilo de fuente SVG

Posted on by Rudeus Greyrat

Estilo de fuente Sintaxis: font-style=»style» Valores de atributo: el atributo puede tener los siguientes valores: normal: Esto especifica que el texto debe mostrarse en la forma normal. cursiva: Esto especifica que el texto debe mostrarse en cursiva. oblicua: Esto especifica que el texto debe mostrarse en forma oblicua. Usaremos el atributo de estilo de fuente … Continue reading «Atributo de estilo de fuente SVG»

Atributo lspace HTML5 MathML

Posted on by Rudeus Greyrat

Este atributo contiene el valor de la longitud del espacio antes de que el valor predeterminado del operador sea thickmathspace (4.32px). Este atributo es aceptado por dos etiquetas de MathML <mo> y <mpadded> . Sintaxis: <element lspace=»intheight»> Valores de atributo: lspace: este atributo es el valor de la longitud del espacio antes del valor predeterminado … Continue reading «Atributo lspace HTML5 MathML»

SVG EllipseElement.rx Propiedad

Posted on by Rudeus Greyrat

La propiedad SVG EllipseElement.rx Devuelve un objeto SVGAnimatedLength correspondiente al atributo del elemento de elipse dado Sintaxis: EllipseElement.rx Valor de retorno: esta propiedad devuelve el objeto SVGAnimatedLength que se puede usar para obtener el rx del elemento Ellipse Ejemplo 1: <!DOCTYPE html> <html>    <body>     <svg width=»300″ height=»300″ xmlns=»http://www.w3.org/2000/svg»>   <ellipse cx=»100″ cy=»100″ rx=»60″ ry=»60″ id=»ellipse» … Continue reading «SVG EllipseElement.rx Propiedad»

Propiedad SVG Element.classList

Posted on by Rudeus Greyrat

La propiedad SVG Element.classList Sintaxis: var attr = element.classList Valor devuelto: esta propiedad devuelve classList Ejemplo 1:  HTML <!DOCTYPE html> <html>    <body>     <svg width=»350″ height=»350″          xmlns=»http://www.w3.org/2000/svg»>                    <a href=»https://www.geeksforgeeks.org»              id=»gfg» class=»geeks»>                            <text x=’100′ y=’100′                  font-size=»50px»>GfG             </text>         </a>                    <script>             var g = document.getElementById(‘gfg’);             console.log(g.classList)         </script>     </svg> </body>    </html> Producción: Ejemplo 2:  HTML … Continue reading «Propiedad SVG Element.classList»

SVG FEDisplacementMap.xChannelSelector Propiedad

Posted on by Rudeus Greyrat

La propiedad SVG FEDisplacementMap.xChannelSelector devuelve el objeto SVGAnimatedEnumeration correspondiente al componente xChannelSelector del elemento FEDisplacementMap.xChannelSelector . Sintaxis: var a = FEDisplacementMap.xChannelSelector Valor devuelto: esta propiedad devuelve el objeto SVGAnimatedEnumeration correspondiente al componente xChannelSelector del elemento FEDisplacementMap.xChannelSelector . Ejemplo 1:  HTML <!DOCTYPE html>  <html>     <body>      <svg width=»200″ height=»200″         viewBox=»0 0 220 220″>             <filter id=»displacementFilter»>  … Continue reading «SVG FEDisplacementMap.xChannelSelector Propiedad»

SVG <feDropShadow> Elemento

Posted on by Rudeus Greyrat

SVG significa Gráfico vectorial escalable. Se puede usar para hacer gráficos y animaciones como en el lienzo HTML. El elemento <feDropShadow> funciona en combinación con otras primitivas de filtro para agregar una sombra al gráfico. Proporciona una capa de desplazamiento borrosa, coloreada y opcional detrás de la entrada original. Sintaxis: <feDropShadow in=»» dx=»» dy=»» stdDeviation=»»/> … Continue reading «SVG <feDropShadow> Elemento»

Atributo SVG xChannelSelector

Posted on by Rudeus Greyrat

El atributo xChannelSelector en SVG se usa para indicar el canal de color de in2 que se usa para desplazar los píxeles a lo largo del eje x. Solo el elemento <feDisplacementMap> está usando este atributo. Sintaxis: yChannelSelector = «R | G | B | A» Valores de atributo: el atributo acepta cuatro valores, como … Continue reading «Atributo SVG xChannelSelector»