Manual de referencia HTML

Glosario de etiquetas HTML

Atributo shadowBlur de HTML canvas

El atributo shadowBlur se utiliza para establecer el nivel de desvanecimiento de la sombra. El valor predeterminado es 0. El elemento <canvas> le permite dibujar gráficos en una página web utilizando JavaScript.

Manual de referencia de canvas HTML

Ejemplo en línea

Dibujar un rectángulo amarillo con sombra negra y sombra azul, el nivel de desvanecimiento es 20：

Ahora veamos un ejemplo para implementar el atributo shadowBlur de canvas:

Ejemplo

<!DOCTYPE html>
<html>
<head>
<title>Uso del atributo shadowBlur en HTML canvas (Tutoriales básicos de la web w3(codebox.com)</<title>
</<head>
<body>
<canvas id="newCanvas" width="450" height="250" style="border:1px sólido #d3d3d3>
您的浏览器不支持 HTML5　canvas 标签
</canvas>
<script>
　　　var c = document.getElementById("newCanvas");
　　　var ctx = c.getContext("2d");
　　　ctx.shadowBlur =　20;
　　　ctx.shadowColor = "black";
　　　ctx.fillStyle = "green";
　　　4,　4,　10　150);
　　　ctx.shadowBlur =　30;
　　　ctx.shadowColor = "azul";
　　　ctx.fillStyle = "naranja";
　　　200,　4　200,　150);
</script
</body>
</html>

Ver prueba ‹/›

Compatibilidad del navegador

IEFirefoxOperaChromeSafari

Internet Explorer 9y Firefox, Opera, Chrome y Safari soportan la propiedad shadowBlur.

Nota:Internet Explorer 8 Las versiones anteriores a la <canvas> no soportan el elemento.

Definición y uso

La propiedad shadowBlur establece o devuelve el nivel de desvanecimiento de la sombra.

Valor predeterminado:	0
Sintaxis de JavaScript:	contexto.shadowBlur=número;

El número superior representa el nivel de desvanecimiento de la sombra.

Valor del atributo

Valor	Descripción
número	Nivel de desvanecimiento de la sombra

Manual de referencia de canvas HTML

HTML: <template> etiqueta