Атрибут width
Описание
Задает ширину холста. По умолчанию 100px.
Синтаксис
<canvas width='размер'></canvas>Пример
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<canvas style="background-color: lightblue;" id="smile" width="200" height="200">
<p>Canvas не поддерживается браузером.</p>
</canvas>
<script>
var drawingCanvas = document.getElementById("smile");
if(drawingCanvas && drawingCanvas.getContext) {
var context = drawingCanvas.getContext("2d");
// Рисуем окружность
context.strokeStyle = "#000";
context.fillStyle = "#ffcd03";
context.beginPath();
context.arc(100,100,50,0,Math.PI*2,true);
context.closePath();
context.stroke();
context.fill();
// Рисуем левый глаз
context.fillStyle = "#000000";
context.beginPath();
context.arc(84,90,8,0,Math.PI*2,true);
context.closePath();
context.stroke();
context.fill();
// Рисуем правый глаз
context.beginPath();
context.arc(116,90,8,0,Math.PI*2,true);
context.closePath();
context.stroke();
context.fill();
// Рисуем рот
context.beginPath();
context.moveTo(70,115);
context.quadraticCurveTo(100,130,130,115);
context.quadraticCurveTo(100,150,70,115);
context.closePath();
context.stroke();
context.fill();
}
</script>
</body>
</html>Читайте также
Тег <dl>
Используется для создания списка с подробным объяснением его элементов. Вмещает внутрь себя элементы dd, dt....
Тег <object>
Определяет, как загружать, отображать объекты, которые не смогли подключиться к браузеру....
Тег <datalist>
Выпадающий список для тега input, который появляется при наведении курсора мыши на данный input ( на пк ) или при нажатии на стрелку рядом ( на мобиль...
Тег <style>
Используется для добавления CSS на web - страницу.
Обычно его располагают внутри head, но можно и в bo...