Scroll Top

Aprenda tudo que você precisa para criar o seu negócio na internet.  São 30 vídeos aulas totalmente gratuitas. Basta se cadastrar em um de nossos formulário.

Tutoriais

Mudar cor e fundos em CSS

mudar cor

Mudar cor e fundos em css

Mudar cor e fundos em css no seu site. Veja agora como aplicar cores de primeiro plano e cores de fundo no seu website. Abordaremos ainda os métodos avançados de controle e posicionamento de imagens de fundo.

 Cor do primeiro plano: a propriedade ‘color’

A propriedade color define a cor do primeiro plano de um elemento.

Considere, por exemplo, que desejamos que todos os cabeçalhos de primeiro nível no documento sejam na cor vermelha. O elemento HTML que marca tais cabeçalhos é o o elemento <h1>. O código a seguir define todos os <h1> na cor vermelha. Veja na postagem anterior como trabalhamos os arquivos index.html e estilo.css para testar os exemplos desta postagem e mudar cor de fundo de algumas páginas.

Código a ser salvo dentro aquivo estilo.css:

h1 {
color: #ff0000;
}

Código a ser salvo dentro do arquivo index.html:

<html>
<head>
<title>Meu documento</title>
<link rel=”stylesheet” type=”text/css” href=”estilo.css” />
</head>
<body>
<h1>Minha primeira folha de estilos</h1>
</body>
</html>

Agora veja a imagem como ficou:

Se você salvou os arquivos dentro da pasta indicada pelo servidor local, basta você abrir o seu navegador e digitar na barra do browser o seguinte endereço: localhost/index.html e surgirá uma imagem semelhante a que está logo abaixo.

propriedade color

Note que as letras ficaram vermelhas!

As cores podem ser definidas pelo seu valor hexadecimal como no exemplo acima  (#ff0000), com o uso do nome da cor (“red”) ou ainda pelo seu valor rgb (rgb(255,0,0)).

A propriedade ‘background-color’

A propriedade background-color define a cor do fundo de um elemento.

 O elemento <body> contém todo o conteúdo de um documento HTML. Assim, para mudar a cor de fundo da página, devemos aplicar a propriedade background-color ao elemento <body>. Você pode aplicar cores de fundo para outros elementos, inclusive para cabeçalhos e textos. No exemplo abaixo foram aplicadas diferentes cores de fundo para os elementos <body> e <h1>.

body {
background-color: #FFCC66;  /* define a cor de fundo */
}
h1 {
color: #990000;  /* define a cor do texto */
background-color: #FC9804; /* define a cor de fundo do texto */
}

Salve o código acima dentro do arquivo estilo.css e rode no seu navegador como demostrado anteriormente.

Obs.: Note que foram aplicadas duas propriedades ao elemento <h1> separadas por um ponto e vírgula.

 Mudar Cor e Fundos no CSS

Veja imagem mudar cor de fundo após rodar no navegador:

prop_brek_color

 

Veja sequência deste estudo no link abaixo:

Images de fundo [background-image]

 

<<< Voltar —

Está Gostando do Artigo?

Se inscreva em nossa lista e receba 30 vídeos aulas grátis, ensinando como criar o seu negócio na internet a partir do zero.

| Website

Sou blogueiro por que gosto de ler e escrever. Criei este blog para te ajudar a criar o seu negócio na internet e ter um novo estilo de vida.

Por gentileza, se deseja alterar o arquivo do rodapé,
entre em contato com o suporte.
error: Este conteúdo está protegido ! Se precisar de alguma coisa envie mensagem pelo formulário de contato.