Comentário: HTML5 pode desenhar muitas formas. A seguir, é apresentado o código para desenhar retângulos. Por favor, consulte isso.
<! Doctype html> <head>
<meta charset = utf-8>
<Title> html5 retângulo </ititle>
<script src = "<a href =" http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js "> </script"> "> </script </a >>
</head>
<Cript>
$ (document) .ready (function () {
var c = document.getElementById ("drawbox");
var drak = c.getContext ("2d"); // Obtenha uma referência ao conteúdo 2D e chame a API de desenho
draw.fillstyle = "#ff0000"; // Método 1 Especifica a cor do preenchimento
draw.fillrect (0,0,300.100); // coordenadas e comprimento e largura
draw.fillstyle = "rgba (0,0,255,0.5)"; // Método 2 RGB+Transparência
draw.fillrect (400,0,100.100); // coordenadas e comprimento e largura
})
</script>
</body>
<lVAs> </canvas>
</body>
</html>
Diagrama de reprodução