网页设计与制作（HTML5+CSS3+JavaScript） 第9章：JavaScript控制HTML5新元素.pptxVIP

第9章JavaScript控制HTML5新元素HTML5规范引进了许多新特性，其中最让人期待就是Canvas元素和视频、音频，HTML5中的新元素提供了通过javascript绘制图形图像、视频音频的方法，该方法使用简单，但是功能强大。9.1 Canvas元素图9.1 Canvas标签定义图形效果canvas标签定义图形，比如图表和其他图像，必须使用脚本来绘制图形。如图15.1所示，在画布上（Canvas）画一个红色矩形，渐变矩形，彩色矩形，和一些彩色的文字。9.2.1 定义 Canvas元素 一个画布在网页中是一个矩形框，通过canvas元素来绘制。【例9.1】 创建一个画布（Canvas）!DOCTYPE htmlhtmlbodycanvas id=myCanvas width=200 height=100 style=border:1px solid #000000;您的浏览器不支持HTML5 canvas标签。/canvas/body/html默认情况下canvas元素没有边框和内容，可以使用style属性来添加边框。标签通常需要指定一个id属性（脚本中经常引用），width和height属性定义的画布的大小。提示：可以在HTML页面中使用多个canvas元素。【程序运行效果】 如图9.2所示，定义了一个宽200像素，高100像素的矩形画图框：图9.2 案例9.1运