Html5 Canvas 예비 학습 노트(3) - 그리기 스타일 및 그리기 텍스트

2d 렌더링 컨텍스트의 fillStyle 및 스트로크 스타일 속성에서는 채우기 색상이나 그리기 색상을 변경할 수 있습니다.

다음 세 가지 방법으로 색상을 수정할 수 있습니다.

Rgb

형식:

context.fillStyle = 'rgb(255,0,0)';//设置绘制颜色
context.strokeStyle = 'rgb(255,0,0)';//设置绘制颜色

16진수 형식:

context.fillStyle = '#FF0000';//设置绘制颜色
context.strokeStyle = '#FF0000';//设置绘制颜色

단어 유형:

context.fillStyle = 'red';//设置绘制颜色
context.strokeStyle = 'red';//设置绘制颜色

또한

획에서 나오는 내용에 대해서는 lineWidth를 변경할 수도 있습니다. 속성 선 너비를 변경하는 경우 기본 선 너비는 1입니다.

효과 비교는 다음과 같습니다.

위는 선폭

1, 아래 줄 너비는 5입니다.

색상, 선 굵기 모두

j2me의 setColor와 동일하니 주의하세요. 값은 사용 후 기본값으로 복원되지 않습니다.

캔버스

에 그려진 텍스트는 이미지 형태로 그려지며 일반 html 텍스트처럼 마우스 포인터로 선택할 수 없습니다. 글꼴 속성에 설정된 캔버스에서 텍스트를 그릴 때 글꼴 크기를 선택할 수 있습니다. 그릴 때 fill 및 Stroke 메소드도 있는데, 각각 채워진 단어와 빈 단어입니다. 두 번째 첫 번째 매개변수와 세 번째 매개변수는 텍스트의 기준점(왼쪽 하단)입니다. 코드 및 폰트 효과는 다음과 같습니다.

은 정상입니다. 및 기울임체 각각 및 속이 빈 단어의 효과:

위는 Html5 Canvas 예비 학습 노트(3) - 그리기 스타일 및 그리기 텍스트의 내용입니다. 더 많은 관련 내용을 주목해주세요. PHP 중국어 홈페이지(www.php.cn)!