Você pode usar o "Notepad++" ou o "Bloco de notas" no Windows; no Mac, use o "TextEdit" ou o "BBEdit".
Adicione o cabeçalho "html" ao documento. Todas as informações de estilo da página (incluindo a cor do plano de fundo) devem ser inseridas entre as tags <style></style>:
Crie uma linha em branco entre as tags "style". É preciso ter uma linha na qual seja possível adicionar informações abaixo da tag <style> e acima da tag </style>.
Adicione a propriedade "background-color" ao elemento "body". Para fazê-lo, digite background-color: entre os colchetes da tag "body". Em seguida, você deverá ter o seguinte elemento "body":
Reveja as informações da tag "style". Agora, o cabeçalho do seu documento HTML deverá estar mais ou menos assim:
Use a propriedade "background-color" para aplicar cores de fundo a outros elementos. Assim como definido no elemento "body", você pode usar o "background-color" para definir cores de fundo de outros elementos, como cabeçalhos, parágrafos e assim por diante. Por exemplo, para aplicar uma cor de fundo a um cabeçalho principal (<h1>) ou um parágrafo (<p>) o código ficaria mais ou menos assim: [2] X Fonte de pesquisa
Entenda a sintaxe básica desse processo. Para criar um gradiente, duas coisas são precisas: o ponto/ângulo inicial e as cores de transição entre eles. É possível selecionar múltiplas cores e fazer com que o gradiente mova entre elas, e você também pode definir uma direção ou ângulo para ele. [3] X Fonte de pesquisa
Crie um gradiente vertical. Se nenhuma direção for definida, o gradiente partirá de cima para baixo. Para criar um gradiente, adicione o seguinte código entre as tags <style></style>:
Cada navegador de internet possui uma implementação de função de gradiente diferente, então será preciso incluir diversas versões do código.
Crie um gradiente direcional. Caso queira criar um gradiente que não seja exclusivamente vertical, é possível adicionar a direção dele para alterar a forma como a mudança de cores acontecerá. Para fazê-lo, digite o seguinte código entre as tags <style></style>: [4] X Fonte de pesquisa