Последние записи
- Как в Delphi XE обнулить таймер?
- Изменить цвет шрифта TextBox на форме
- Ресайз PNG без потери прозрачности
- Вывод на печать графического файла
- Взаимодействие через командную строку
- Перенести программу из Delphi в Lazarus
- Определить текущую ОС
- Автоматическая смена языка (раскладки клавиатуры)
- Сравнение языков на массивах. Часть 2
- wprintf как напечатать кириллицу
Интенсив по Python: Работа с API и фреймворками 24-26 ИЮНЯ 2022. Знаете Python, но хотите расширить свои навыки?
Slurm подготовили для вас особенный продукт! Оставить заявку по ссылке - https://slurm.club/3MeqNEk
Online-курс Java с оплатой после трудоустройства. Каждый выпускник получает предложение о работе
И зарплату на 30% выше ожидаемой, подробнее на сайте академии, ссылка - ttps://clck.ru/fCrQw
27th
Ноя
Градиент в Javascript: градиент текста
Posted by obzor under JavaScript
Решил попробовать градиент текста.. Вроде текст выводит, но буквы пустые с окантовкой, не залиты градиентом. Как их залить градиентом чтобы внутри букв не была пустота?
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
.teststyle{
padding: 5px;
box-shadow: 20px 20px 20px gray;
border:8px dashed brown;
border-radius: 50px;
}
</style>
<title>Canvas в HTML5</title>
</head>
<body onload='draw()'>
<canvas class='teststyle' id='canvas' width='800' height='200'></canvas>
<script>
var c=document.getElementById("canvas");
var ctx=c.getContext("2d");
ctx.font="20px Georgia";
ctx.strokeText("Hello World!",10,50);
ctx.font="80px bold Verdana";
// Создаем градиент
var gradient=ctx.createLinearGradient(0,0,c.width,0);
gradient.addColorStop("0","magenta");
gradient.addColorStop("0.5","blue");
gradient.addColorStop("1.0","red");
// Заполним градиентом
ctx.strokeStyle=gradient;
//Отступ слева, отступ сверху
ctx.strokeText("Добро пожаловать!",10,150);
</script>
</body>
</html>
для вывода заполненного текста есть fillText():
// Заполним градиентом
ctx.fillStyle=gradient;
//Отступ слева, отступ сверху
ctx.fillText("Добро пожаловать!",10,150);
Похожие статьи
Купить рекламу на сайте за 1000 руб
пишите сюда - alarforum@yandex.ru
Да и по любым другим вопросам пишите на почту
пеллетные котлы
Пеллетный котел Emtas
Наши форумы по программированию:
- Форум Web программирование (веб)
- Delphi форумы
- Форумы C (Си)
- Форум .NET Frameworks (точка нет фреймворки)
- Форум Java (джава)
- Форум низкоуровневое программирование
- Форум VBA (вба)
- Форум OpenGL
- Форум DirectX
- Форум CAD проектирование
- Форум по операционным системам
- Форум Software (Софт)
- Форум Hardware (Компьютерное железо)