Color Font

Caio Wesley · Maio 22, 2017

Sou novo na área , estou aprendendo agora , gostaria de uma ajuda , estou tentando fazer um menu estou seguindo alguns tutoriais no youtube , fiz um menu só que não consigo mudar a cor da fonte nem tirar o sublinhado , se alguém poder me ajudar agradeço muito !!

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>

<link href="css/reset.css" rel="stylesheet" type="text/css" />
<link href="css/estilo.css" rel="stylesheet" type="text/css" />
<style type="text/css">
body {
	background-image: url(../PLANILHAS%20CAIO/projeto/imagens/fundo.jpg);
}
</style>
</head>


<body>


			<div id="logo">
					</div>			<!--div final do logo-->
			<div id="topo"></div>			<!--div final topo-->   
            <div id="menufundo"><nav id="menu">
       		<ul>
        		<li><a href="#">Pagina Inicial</a></li> 
        		<li><a href="#">Produtos</a></li>
        		<li><a href="#">Missão</a></li>
        		<li><a href="#">Links</a></li>
        		<li><a href="#">Contato</a></li>
    		</ul>
       </nav>                
</div>                
			<div id ="fundoinicial">
</div>			<!--div final fundoinicial-->
                    
                    
          
                  	
                        
              			
                   
                        
</body>
</html>

@charset "utf-8";
/* CSS Document */


#topo {
	background:url(../imagens/topo.png);	
	position:inherit;
	width:1024px;
	height:190px;
	border-bottom:none;
	margin:auto;

}

#logo {
	float: left;
	background:url(../imagens/logoc.png);
	position:relative;
	top:50px;
	left:230px;
	width:541px;
	height:133px;
}
	
#fundoinicial {
	background-image:url(../imagens/fundoof.png);
	width:1024px;
	height:1080px;
	margin:auto;
	
}

#menufundo {
	background:url(../imagens/menu.png);
	position:relative;
	width:1024px;
	height:30px;
	margin:auto;
}


#menu ul li {
	font-family:Arial, Helvetica, sans-serif;
	font-size:26px;
	line-height:30px;
	display:inline;
    padding:30px;
    margin:20px;
	color:#FFF;
	
}

Marcos Renato · Maio 22, 2017

Por padrão os navegadores já tem algumas configurações de css como por exemplo o sublinhado dos links e a cor azul, diferentes tamanhos de fonte para h1,h2,h3 e etc...

a melhor forma de aprender esse tipo de coisa é usando o inspecionar elemento do chrome ou qualquer outro similar em outros navegadores e procurando dentro do seu html e mudando o css deles no painel que vai aparecer a sua direita.

Dessa forma você pode ir fazendo "teste" antes de aplicar no seu código.

se clicar com o botão direito e marcar uma das opções de :hover, :focus e etc você pode fazer o mesmo para ações, ao selecionar ele simula aquele estado para você poder testar. Mas vale lembrar que depois de realizados os testes você precisa aplicar no seu código. o inspecionar elemento (F12 no crhome) é só para testes.

Nesse seu caso você precisa usar:

#menu ul li a{
  color: blue;
  text-decoration: none; // text-decoration é o sublinhado
}

Caio Wesley · Maio 22, 2017

Muito Obrigado pelas dicas esta me ajudando muito , mas eu add os codigos color e text-decoration , mesmo assim não sai o sublinhado e a cor não muda.

Marcos Renato · Maio 22, 2017

Olá amigo!

https://jsfiddle.net/gdu0260L/

da uma olhadinha coloquei o código alterado aqui para você;

att

@Caio Wesley Vi que você está estudando front-end.
Vou te dar algumas dicas aqui para você começar da maneira mais fácil e preparada para fazer dinheiro possível hoje em dia, dei uma olhada em algumas coisas e as ferramentas que você está usando são bem limitadas tecnicamente você estaria perdendo tempo.

Oque aconselho você a fazer é utilizar o programa de sua preferencia para criar o layout, mas o mais usando hoje em dia é o photoshop.

Mas para criar o html+css aconselho você a utilizar o bootstrap.

Bootstrap é uma ferramenta que já tem diversas coisas prontas como menus, buttons, inputs e etc.

Já tem tabulação responsiva para você não precisar ficar fazendo tudo do zero como você está fazendo.

A principio pode parecer coisa demais para sua cabeça mas acredite você vai decolar na frente da galera.

Muita gente prefere aprender tuuuudoo para depois aprender o certo.

Obviamente você vai precisar saber html + css para personalizar os elementos do bootstrap e deixar do jeito que você desenhou, mas MUITA coisa você não vai precisar perder tempo entende?

estude a estrutura de um site usando sections, containers, row e cols. Estude o comportamento dos cols xs, md, lg e etc.

depois disso é só sucesso.

aqui tem uma playlist de bootstrap:

Entrar

Color Font

Pergunta

Caio Wesley

Link para o comentário

Compartilhar em outros sites

3 respostass a esta questão

Posts Recomendados

Marcos Renato

Link para o comentário

Compartilhar em outros sites

Caio Wesley

Link para o comentário

Compartilhar em outros sites

Marcos Renato

Link para o comentário

Compartilhar em outros sites

Participe da discussão

Estatísticas dos Fóruns

Navegação

Atividades