Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Bom galera to até sem jeito de voltar aki denovo e abrir outro topico, achei que tinha resolvido mas na pratica mesmo, não consegui não, após mostrar para o meu cliente ela não gostou nada e falou que não queria isso...
O que ela quer é que tenha esse formato, só que com os icones do menu, que foi colocado no layout. Não sei o que faço pois o que eu consegui foi com a ajuda do Marcelo, preciso de algo que junta-se o do marcelo com o os icones do meu layout... será que alguem pode me ajudar??
a Imagem do site
abaixo segue o codigo que o Marcelo me ajudou
<!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>Border</title>
<style type="text/css">
#cont-div{
position:relative;
margin-left:200px;
}.menu-home, .menu-quem-somos, .menu-produtos, .menu-orcamento, .menu-contato{
width:0px;
height:0px;
border-left:80px solid transparent;
border-right:80px solid transparent;
border-top:300px solid transparent;
border-radius: 100%;
cursor:pointer;
}
.menu-home{
border-top-color:#060;
-webkit-transform: rotate(-40deg);
-moz-transform: rotate(-40deg);
-ms-transform: rotate(-40deg);
-o-transform: rotate(-40deg);
transform: rotate(-40deg);
}.menu-quem-somos{
border-top-color:#CF3;
-webkit-transform: rotate(-70deg);
-moz-transform: rotate(-70deg);
-ms-transform: rotate(-70deg);
-o-transform: rotate(-70deg);
transform: rotate(-70deg);
top:-235px;
left:-45px;
position:relative;
margin-top:3px;
}.menu-produtos{
border-top-color:#06F;
-webkit-transform: rotate(-100deg);
-moz-transform: rotate(-100deg);
-ms-transform: rotate(-100deg);
-o-transform: rotate(-100deg);
transform: rotate(-100deg);
top:-457px;
left:-50px;
position:relative;
margin-top:3px;
}.menu-orcamento{
border-top-color:#C3F;
-webkit-transform: rotate(-130deg);
-moz-transform: rotate(-130deg);
-ms-transform: rotate(-130deg);
-o-transform: rotate(-130deg);
transform: rotate(-130deg);
top:-686px;
left:-17px;
position:relative;
margin-top:3px;
}.menu-contato{
border-top-color:#C03;
-webkit-transform: rotate(-160deg);
-moz-transform: rotate(-160deg);
-ms-transform: rotate(-160deg);
-o-transform: rotate(-160deg);
transform: rotate(-160deg);
top:-938px;
left:45px;
position:relative;
margin-left:3px;
}</style>
</head>
<body>
<div id="cont-div">
<div class="menu-home"></div>
<div class="menu-quem-somos"></div>
<div class="menu-produtos"></div>
<div class="menu-orcamento"></div>
<div class="menu-contato"></div>
</div>
</body>
</html>Carregando comentários...