Autor Tópico: CSS Fazer a ligação Árvore SMF  (Lida 5712 vezes)

0 Membros e 1 Visitante estão a ver este tópico.

Offline Webmaster

  • Desenvolvimento
  • *
  • Mensagens: 2236
  • Rank: 113
  • Sexo: Masculino
  • JoomlaMZ !
    • Servidores
CSS Fazer a ligação Árvore SMF
« em: 06 de Junho de 2016, 19:51 »



index.css

Código: [Seleccione]
/* The navigation list (i.e. linktree) */
.navigate_section
{
   padding: 0.5em;
   margin: 0 0 0 0;
}
.navigate_section ul
{
   display: block;
   margin: 0;
   font-size: 0.9em;
   padding: 1em 0 0.5em 0;
   border-top: 1px solid #ccc;
   overflow: hidden;
   list-style: none;
   clear: both;
   width: 100%;
}
.navigate_section ul li
{
   float: left;
   padding: 0 0.5em 0 0;
   font-size: 0.95em;
}
.navigate_section ul li a
{
   white-space: pre;
}

/* The footer wih copyright links etc. */


Alterar colocar assim




Código: [Seleccione]
/* The navigation list (i.e. linktree) */
.navigate_section {
padding: 0.5em;
margin: 0;
}

.navigate_section ul {
display:block;
margin:0;
padding:0;
overflow:hidden;
list-style:none;
clear:both;
width:100%
}

.navigate_section ul li {
float:left;
font-size:11px
}

.navigate_section ul li a {
color:#fff
}

.navigate_section ul li {
color:#fff;
text-decoration:none;
padding:10px 0 10px 30px;
background:#1abc9c;
position:relative;
display:block;
float:left;
cursor:pointer
}

.navigate_section ul li:after {
content:" ";
display:block;
width:0;
height:0;
border-top:50px solid transparent;
border-bottom:50px solid transparent;
border-left:20px solid #1abc9c;
position:absolute;
top:50%;
margin-top:-50px;
left:100%;
z-index:2
}

.navigate_section ul li:before {
content:" ";
display:block;
width:0;
height:0;
border-top:50px solid transparent;
border-bottom:50px solid transparent;
border-left:20px solid #fff;
position:absolute;
top:50%;
margin-top:-50px;
margin-left:1px;
left:100%;
z-index:1
}

.navigate_section li:first-child {
padding-left:10px;
border-radius:2px 0 0 2px
}

.navigate_section ul li:hover {
background:#12273A
}

.navigate_section ul li:hover:after {
border-left-color:#12273A!important
}
/* The footer wih copyright links etc. */
Apllic! WebSuporte