letras de menu cambiantes

Lo siento mucho Yaneth :(

te molesto mas de lo quisieras pero las letras de mi menu no cambian por mucho que pase por encima el menu.

actualmente mi hoja de estilo-general.css tiene estos comandos

* {margin:0px ; padding:0px ; border: 0px}
body {text-align: center}
#global {width:800px ; margin: 4px auto }
#cabecera {background-color: pink }
#navegacion {background-color: gray }
#contenido {background-color: orange ; width: 800px ; float:left}
#menu {background-color: yellow; width: 150px ; float:left ; text-align:left }
#menu li {list-style: none ; margin: 4px 0px 4px 6px }
#pie {background-color: brown}
a {color: brown ; font-size:1.3em ; text-decoration: none}
a: link {}
a: visited {}
a: hover { color: red ; text-decoration: underline }
a: active {}


puedes ver algo mal escrito???? :roll:
Un abrazo muy fuerte!
Yaneth ha dejado el foro temporalmente asique te tendrás que conformar con los demas, jeje.

No entiendo muy bien lo que pasa, dices que no te cambia el color de letra de los enlaces cuando pasas el raton por encima?

De todas formas pon el codigo html tambien.
Hol a SaYaN...

A ver si he acertado, es el codigo de mi plantilla:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Page title</title>
<link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
</head>
<body>
<div id="global">
<div id="cabecera">Bienvenidos a mi Web</div>
<div id="navegacion">Barra de Navegación</div>
<div id="contenido">
<div id="menu">
<ul>
  • Enlace 1
  • Enlace 2
  • Enlace 3

    </div>
    Esta será la zona principal de la web
    </div>
    <div id="pie">Este es el pié de página</div>
    </div>
    </body>
    </html>
  • Un abrazo muy fuerte!
    se me resite este problema, veo el código correcto, dame algo de tiempo, o aver si alguien sabe.

    Saludos.
    esto es muy facil para que los enlaces cambien todo esta en el grupo de las a

    a hover
    a link

    etc...

    simplemente ponle un estilo a diferente a cada una

    ejemplo

    a {color: brown ; font-size:1.3em ; text-decoration: none}
    a: link {color: brown}
    a: visited {color: white}
    a: hover { color: red ; text-decoration: underline }
    a: active {color: white; text-decoration: underline}

    vele cambiando a ver ke pasa

    si tu problema es con los enlaces del menu de la izquierda entonces tendras que crear un nuevo grupo de "a" ejemplo:

    si yo tengo en mi hoja de estilos

    #menu {..........}

    entonces creare

    #menu a {color: red; text-decoration:none ; display: block }
    #menu a:link {color: red}
    #menu a:visited {}
    #menu a:hover {color:white ; text-decoration:underline ; }
    #menu a:active {color:white}
    no logro ver nada, os adjunto la plantilla html y la hoja de estilo-general.css como las tengo ahora mismo...
    podeis ver nada mal???

    plantilla html


    <html>
    <head>
    <title>Page title</title>
    <link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
    </head>
    <body>
    <div id="global">
    <div id="cabecera">Bienvenidos a mi Web</div>
    <div id="navegacion">Barra de Navegación</div>
    <div id="contenido">
    <div id="menu">
    <ul>
  • Enlace 1
  • Enlace 2
  • Enlace 3

    </div>
    Esta será la zona principal de la web
    </div>
    <div id="pie">Este es el pié de página</div>
    </div>
    </body>
    </html>


    estilo-general.css


    * {margin:0px ; padding:0px ; border: 0px}
    body {text-align: center}
    #global {width:800px ; margin: 4px auto }
    #cabecera {background-color: pink }
    #navegacion {background-color: gray }
    #contenido {background-color: orange ; width: 800px ; float:left}
    #menu {background-color: yellow; width: 150px ; float:left ; text-align:left }
    #menu li {list-style: none ; margin: 4px 0px 4px 6px }
    #pie {background-color: brown}
    #menu a{color: brown ; font-size:1.3em ; text-decoration: none}
    #menu a: link {color: blue }
    #menu a: visited {color: grey }
    #menu a: hover { color: red ; text-decoration: underline }
    #menu a: active {color: white; text-decoration: underline }

    a ver si le podeis ver el fallo...

    en todo caso gracias!!! :wink:
  • Un abrazo muy fuerte!
    hola linkgl!

    la leccion del curso habla del cambio de color y aparicion de subrallado, de las letras del menu de la izquierda cuando el cursor se desplaza por encima de ellas.

    habla de otro cambio de color una vez se ha "clicado" uno de los enlaces de este menu.

    Mi problema es que: si bien cuando mi cursor esta encima de ellas, cambia la forma de "flecha" por la de "mano", estas letras no cambian de color, ni aparecen subralladas ni nada...

    podria ser el motivo que no hay ningun menu (entiende contenido real ) asociado?
    Un abrazo muy fuerte!
    isalavedra escribió:no logro ver nada, os adjunto la plantilla html y la hoja de estilo-general.css como las tengo ahora mismo...
    podeis ver nada mal???

    plantilla html


    <html>
    <head>
    <title>Page title</title>
    <link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
    </head>
    <body>
    <div id="global">
    <div id="cabecera">Bienvenidos a mi Web</div>
    <div id="navegacion">Barra de Navegación</div>
    <div id="contenido">
    <div id="menu">
    <ul>
  • Enlace 1
  • Enlace 2
  • Enlace 3

    </div>
    Esta será la zona principal de la web
    </div>
    <div id="pie">Este es el pié de página</div>
    </div>
    </body>
    </html>


    estilo-general.css


    * {margin:0px ; padding:0px ; border: 0px}
    body {text-align: center}
    #global {width:800px ; margin: 4px auto }
    #cabecera {background-color: pink }
    #navegacion {background-color: gray }
    #contenido {background-color: orange ; width: 800px ; float:left}
    #menu {background-color: yellow; width: 150px ; float:left ; text-align:left }
    #menu li {list-style: none ; margin: 4px 0px 4px 6px }
    #pie {background-color: brown}
    #menu a{color: brown ; font-size:1.3em ; text-decoration: none}
    #menu a: link {color: blue }
    #menu a: visited {color: grey }
    #menu a: hover { color: red ; text-decoration: underline }
    #menu a: active {color: white; text-decoration: underline }

    a ver si le podeis ver el fallo...

    en todo caso gracias!!! :wink:

  • Hola:
    Hay muchas cosas que a veces funcionan y otras no lo hacen, sea porque hay directivas que no son compatibles con la herencia o que no sean compatibles con lo que tiene el navegador por defecto.
    Quizás si usted primero crease un grupo de pseudoclases (así se llaman los grupos de las a)

    a {color: brown ; text-decoration:underline ; display: block }
    a:link {}
    a:visited {}
    a:hover {color:red ; text-decoration:underline ; background-color: silver}
    a:active {color:black}
    Cuando usted pone en
    a {color: brown ; text-decoration:underline ; display: block } ese text-decoration:underline hará que cuando ponga el cursor en el enlace este se mostrará subrayado, ese grupo es para toda la web, ahora si usted desea que solo en su menu cambien algunas cosas referentes a los enlaces, entonces añade otro grupo debajo de ese grupo de las a.
    Pruebe con #menu li a{color:aqua;text-decoration:none:display:block;}
    #menu li a:link{}
    #menu li a:visited{}
    #menu li a:hover{color:red;background-color:white}
    #menu li a:active{}
    Si usted pone text-decoration:underline, el enlace se le mostrará subrayado, si usted pone text-decoration:none, el enlace se le mostrará sin el subrayado
    fuera de eso usted en la primera a no ha definido si es un display block o no, la lista de enlaces del menu suele ser un display:block, ya que es una lista en bloque, Experimente un poco para que vaya comprendiendo como funcionan las a
    Saludos
    Agradecido de los que aprenden enseñando
    OK!

    ya voy viendo...

    entre los dos habeis conseguido que vaya perdiendo el miedo a las "a", y de paso que consiga ver cómo funcionan estos comandos...

    muchas gracias de verdad! :wink: