课堂小计

时间 2019-11-14

标签课堂小计繁體版

原文原文链接

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　元素
html

要点1：html元素是指开始标签到结束标签的全部代码，包括标签。而元素的内容是开始标签到结束标签之间的内容。<br>是没有内容的空元素，空元素在开始标签就关闭了，不过将来建议写成<br/>二者效果同样。标签拥有属性：<a href="www."></a>。属性老是在开始标签中规定：name=value；好比href=“www.”这是a标签的href属性。<h1 align="center"></h1>;这是h1标签的对齐方式align属性，属性值是center居中对齐。<body bgcolor="yellow"></body>一样背景颜色属性。class，id，style，title属性常常用到，其中title属性是当鼠标移到元素内容上时会显示的信息。<hr/>标签是分割线，别和<br/>换行符搞混。记住：HTML 代码中的全部连续的空行（换行）也被显示为一个空格。文本格式有不少：http://www.w3school.com.cn/html/html_formatting.asp浏览详细。大体有：文本格式化（包含斜体，变大，变小，上标（上移）下移等等）。预格式文本<pre></pre>保留代码样式。删除字下划线等等。
spa

接下来是重点内容：画布.net

1.con.fillStyle = "red"，con.fillRect(0, 0, 100, 100);con.fillStyle = "rgba(255,0,0,0.2)";定义填充的颜色。（其中0.2是透明度0-1愈来愈明显，大于1为全显示，小于0为全透明）orm

同理con.strokeStyle = "blue";定义外框的颜色。通常写在要定义的内容上面才有效好比：htm

con.fillStyle = "red";
con.strokeStyle = "blue";
con.fillRect(0, 120, 100, 100);
con.strokeRect(120, 120, 100, 100);blog

con.clearRect(50, 50, 240, 120);是清楚画布的像素，至关因而在画布上画一个空白区域it

context.arc(x,y,r,sAngle,eAngle,counterclockwise);画一个弧线，一般用来画圆

例如：con.beginPath();
con.arc(200, 150, 100, 0, Math.PI * 1.5, false);
/*con.closePath();*/
con.fillStyle = 'rgba(0,255,0,0.25)';
con.stroke()form

con.closePath()class

x，y是圆心坐标。r圆的半径单位像素。sAngle和eAngle分别是初始角度和结束角度，右边水平为0°。counterclockwise是顺逆时针，ture为逆时针，false为顺时针。bfc

上面的例子填充的是绿色，可是圆的方法为stroke画线，因此颜色无效，为默认颜色，而且是个没填充的圆，还缺了90度的线-.-。

con.arc()先后最好是加con.beginPath（）和con.closePath（）否则会有意想不到的图像出现。

context.strokeStyle = "rgb(250,0,0)";
            context.fillStyle = "rgb(250,0,0)"
            context.lineTo(100, 100);
             context.lineTo(200, 200);
             context.lineTo(200, 100);
             context.moveTo(200, 50);
             context.lineTo(100,50);
             context.stroke();
其中

context.strokeStyle = "rgb(250,0,0)";
            context.fillStyle = "rgb(250,0,0)"至关因而样式吧，就是颜色。

context.stroke();至关因而方法，用实线仍是用填充。线段都是moveto起点到lineto终点。若是没有moveto那么第一个lineto就至关于moveto。
渐变色：

线性渐变 var lg= context.createLinearGradient(xStart,yStart,xEnd,yEnd)

线性渐变颜色lg.addColorStop(offset,color)

context.fillStyle = g1;

context.fillRect(0, 0, 400, 300);

xStart,yStart,xEnd,yEnd分别是渐变色的起点xy和终点xy。offset偏移量，理解（范围0-1，假设偏移量为0.5，那么红变蓝只占了一半，后面一半全是蓝色）。后面两个公式就至关因而把这个渐变应用到下面那个400*300的矩形填充框里面，固然设为stroke就是矩形边框。更多详情参考　　　　　　　　　　　　　　　　　　　　　　http://blog.csdn.net/clh604/article/details/8536059