Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Lucas Lima_96406

Menu em CSS?

Por , em Desenvolvimento frontend

Recommended Posts

Lucas Lima_96406    0

Lucas Lima_96406
Postado

Olá,

Situação: Vi um menu super legal no site Barba Longa ( http://www.barbalonga.xpg.com.br/ ), Quado passamos o mauser tem um background aredondado e preto e parece ter um pouco de JQuery. Vocês sabem O Código Para um Menu igual esse?

 

Outro Parecido também é do Estudio Pirata ( http://www.estudiopirata.com/ )

Compartilhar este post

Link para o post
Compartilhar em outros sites

allex_carvalho    124

allex_carvalho
Postado

Não daria para fazer com imagem não? Faz uma imagem suponhamos com 50px de altura. No css você só define 25px a altura e coloca a imagem como background. Ai no hover você defini background-position:bottom;

Compartilhar este post

Link para o post
Compartilhar em outros sites

Lucas Lima_96406    0

Lucas Lima_96406
Postado

Fiz Assim Olhe:

 

<!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>Documento sem título</title>

<style type="text/css">

body{ margin:0 auto;}

#menu{}

#menu ul{ list-style:none;}

#menu ul li{ display:inline; padding:5px 5px;font:16px Tahoma, Geneva, sans-serif; font-weight:bold;}

#menu ul li:hover{ background:#393;-moz-border-radius: 7px; -webkit-border-radius: 7px; border-radius: 7px;}

#menu a{text-decoration:none;color:#333;}

#menu a:hover{color:#FFF;}

</style>

</head>

 

<body>

<div id="menu">

<ul>

<a href="#"><li>Home</li></a>

<a href="#"><li>Empresa</li></a>

<a href="#"><li>Outros</li></a>

</ul>

</div>

</body>

</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito