Hola de nou a tots i a totes. He trobat una nova forma de fer un menu horitzontal molt i molt més fàcil que canviant manualment la plantilla. Com avança la informàtica! jejeje
Aquí us presento un menú molt senzill i útil que podeu posar en el vostre blog fàcilment.
Només cal afegir un nou Elemento HTML damunt de la zona d'entrades (preferiblement) i en ell posem el següent codi:
..................................................
<div id="menuarriba">
<ul id="navi1">
<li><a href="
#">
Inicio</a></li>
<li><a href="
#">
Acerca de</a></li>
<li><a href="
#">
Enlazar</a></li>
<li><a href="
#">
Contacto</a></li>
< /ul>
< /div>
< style type="text/css">
#navi1 {
margin:0px;
padding:0px;
}
#navi1 li {
-moz-border-radius-topleft:15px;
-moz-border-radius-topright:15px;
-moz-border-radius-bottomleft:0px;
-moz-border-radius-bottomright:0px;
-webkit-border-top-left-radius:15px;
-webkit-border-top-right-radius:15px;
-webkit-border-bottom-left-radius:0px;
-webkit-border-bottom-right-radius:0px;
background:url(http://i825.photobucket.com/albums/zz180/latrucoteca/Degradadomini-1.png);
color:#000000;
margin:5px;
padding:3px;
width: 100px;
border:1px solid black;
text-align:center;
list-style:none;
font-family: Segoe UI, Arial;
font-size: 14px;
float:left;
}
#navi1 li:hover {
-moz-border-radius-topleft:20px;
-moz-border-radius-topright:20px;
-moz-border-radius-bottomleft:0px;
-moz-border-radius-bottomright:0px;
-webkit-border-top-left-radius:20px;
-webkit-border-top-right-radius:20px;
-webkit-border-bottom-left-radius:0px;
-webkit-border-bottom-right-radius:0px;
background:url(http://i825.photobucket.com/albums/zz180/latrucoteca/Degradadomini-1.png);
color:#000000;
border:1px solid black;
}
#navi1 li a:hover {
color: #ffffff;
font-style: Italic;
text-decoration: none;
}
#navi1 a {
color: #ffffff;
font-weight: bold;
}
< /style>
..................................................
Un cop li donis a Guardar modifica la següent part:
..................................................
<li><a href="
#">
Inicio</a></li>
<li><a href="
#">
Acerca de</a></li>
<li><a href="
#">
Enlazar</a></li>
<li><a href="
#">
Contacto</a></li>
..................................................
Les
paraules en vervell pel tìtol que vulguis i l'
asterisc per la URL de la pàgina o la secció que vols enllaçar.
També pots afegir una línia més de les presents, és a dir, un botó més en el menú:
..................................................
<li><a href="
#">
Un altre títol</a></li>
..................................................
I així ja podreu disposar d'un senzill però atractiu menú per organitzar més a fons el vostre blog.
Notes:
· En
Mozilla Firefox, Safari y Google Chrome, el menú té la propietat d'estar un pel rodonet, però en
Internet Explorer, desafortunadament
no, tot i que no queda menys elegant.
· Si un títol massa llarg no encaixa be, proba a eliminar
width: 100px; , o a posar un nombre més gran.
És evident que les noves tecnologies ja formen part de la quotidianitat i ens ofereixen un ampli ventall de possibilitats de formació. Els continguts a ensenyar són els mateixos, però metodològicament, les maneres de transmetre’ls s’han eixamplat. Avui, ja no entenem el futur de l’educació sense l’ús de les noves tecnologies.
