Cascading Style Sheet código de projeto Web inclui uma opção de inclinação, para que possa adicionar CSS só de fundos de gradiente para seus sites WordPress sem qualquer necessidade de imagens fatiadas. No WordPress, você não pode aplicar o gradiente com a tag do corpo como faria para fundos sólidos, mas você pode usar um recipiente div que envolve todo o site. Muitos temas construídos em quadros CSS já incluem tal div, mas você pode adicionar um se o seu tema não.

Vou ao wp-admin diretório do seu site e fazer login no painel do WordPress. Navegar para Aparência e clique no editor ligação. Clique no link para header.php sob os modelos indo para carregar o arquivo HTML contendo tag corpo do seu site.

Video: Criando Gradiente com CSS

Procure uma div com um ID de "recipiente" diretamente abaixo da tag do corpo em seu arquivo header.php. Se você não encontrar um, adicione um. Aqui está o que ele deve ser parecido:

&ID de lt-div ="recipiente"gt;

Salve o arquivo, clicando no azul A actualização dos ficheiros botão. Se você adicionou um div, carga footer.php no editor e adicione < / div>- directamente acima <- / organismo>- para fechar a div.

Carga style.css no editor. Adicione este código para a parte inferior do arquivo:

recipiente {

cor de fundo: # 038394- fundo-imagem: linear de gradiente (topo, # 038394, # 00CCCC) - imagem de fundo: -webkit-linear de gradiente (topo, # 038394, # 00CCCC) - imagem de fundo: -moz -linear-gradiente (topo, # 038394, # 00CCCC) -}

O código acima define um fallback para navegadores que não suportam gradientes. Configuração "imagem de fundo" para "Gradiente linear" cria o fundo gradiente. No mínimo, você precisa definir uma direção para o gradiente para começar em e, em seguida, duas cores que se desvanecem no outro. Adicione essa linha de código novamente duas vezes, acrescentando que o Webkit e prefixos Mozilla para o Chrome, Safari e Firefox.

Clique no azul A actualização dos ficheiros botão para salvar o arquivo style.css. Seu fundo gradiente agora aparece em cada página do seu site WordPress.

Gorjeta

Defina todas as margens a zero para o seu "recipiente" div se você vê espaço em branco em torno de seu gradiente.

Video: Illustrator Cs6 - Gradiente

Referências

CSS3 por favor: The Cross-Browser CSS3 Regra Gerador

Video: Como trocar o fundo do wordpress aula 4

Sobre o autor

Sara Williams vive no oeste de Nova York, onde ela é um web designer freelance e escritor conteúdo. Ela é especializada em web design, desenvolvimento e temas computador-hardware. Williams mantém um Associate of Applied Science em sistemas informáticos.

Como fazer um fundo gradiente em wordpress