Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Então galera... sou realmente MUITO novo em CSS... em programação tenho algum tempo, mas em CSS sou virgem ainda!
Eu tava tentando inventar alguma coisa... tipo uma "coluna" (não sei como chamar) no lado esquerdo, tipo um menu. Só que eu queria fazer cada link dentro de um caixa. Daí, se eu fizer isso a caixa pode ir p/ a direita ou para a esquerda demais. Eu li sobre margin e consegui arrumar um pouco, pra diminuir a distrância entre cada caixa, mas se eu aumento um pouco a distância, as caixas se movem para o lado :(
Outra dúvida que eu tenho é como fazer para mudar a cor do link quando eu passo o mouse por cima. Eu usei o a:hoover, mas não muda de cor... teria como fazer com a caixa toda isso ou eu teria que fazer uma nova caixa e agrupar tudo? (tipo um jpeg) :P
E outra dúvida... última... o quadrado azul... como faço para levar ele pra cima?
Meu amigo usou right, left, mas eu não consegui usar... só consegui ajeitar as coisas usando margin-left e coisarada.
Alguém me ajuda?
Valeu galera... nem que seja por mandarem um link.
Falou, abraço!!
Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><title>Teste de CSS</title><style type="text/css">body{ background-color: #FFFFFF;}#menu1_fundo{ background-color: #A5FF8A; border: solid thin #333333; width: 150px; height: 500px;}#menu2{ background-color: #333333; color: #FFFFFF; font-family: "verdana"; width: 120px; height: 15px; font-weight: bold; font-size: 10px; border-bottom: thin solid #000000; border-left: thin solid #000000; border-right: thin solid #000000; border-top: thin solid #000000; margin-left: 30px; margin: 4px;}#quadrado{ background: #0099FF; width: 200px; height: 200px; border: solid thin #333333; margin-left: 300px; margin-bottom: 600px; }a.link1{ color: #FFFFFF; text-decoration: none;}a.link1:hover{ color: #33FF00; text-decoration: none;}a:visited{ color: #FFFFFF; text-decoration: none;}#texto1{ color: #FFFFFF; font-family: "Verdana"; font-size: 10px; font-weight: bold;}</style> </head><body><div id="menu1_fundo"><div id="menu2" align="center"><a href="[http://www.yahoo.com.br" id="link1">Yahoo!</a></div><div id="menu2" align="center"><a href="http://www.google.com.br" id="link1">Google</a></div></div><div id="quadrado"></div> </body>
Carregando comentários...