Queridos amigos, lamento molestar otra vez, pero tengo un nuevo problema con los enlaces de mi página, lo que necesito hacer es que en un párrafo aparezcan diferentes nombres y que cuando el cursor se pose sobre ellos estos cambien de color y al "clickearlos" estos me conduzcan a una nueva página, pero al hacer el procedimiento del enlace se desconfigura el párrafo y el nombre en cuestión queda solo en una línea y no encuentro forma de dejarlo uniforme...
AYUDA POR FAVOOORR!!!!
hola
eso pasa por el display block del grupo de las "a"
saludos
pero que tengo ke hacer???
puedes quitarlo
o bien hacer un grupo de "a" para textos
A.texto {font-weight:bold ; font-sixe:12px ; text-decoration: none ; }
A.texto:LINK { ;}
A.texto:VISITED { ;}
A.texto:HOVER {color:red ; }
A.texto:ACTIVE {text-decoration: underline ; }
y en el html asi
enlace palabra
si en el grupo de las "a" tienes el display blok
cuando creas otro grupo, debes ponerle la contra
display:inline
saludos
Tengo esto en HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Profesores</title>
<link rel="stylesheet" href="../estilos-profes.css" type="text/css" media="all">
</head>
<body>
<div id="global">
<div id="curva-superior"></div>
<div id="cabecera">
<meta content="text/html; charset=iso-8859-1" http-equiv=Content-Type>
<div id="logotipo">
<a href="../index.html">
[contenido no disponible] </a>
</div>
<div id="publicidad">DOCENTES Y NO DOCENTES</div><link rel="stylesheet" type="text/css" href="estilos.css" />
</div>
<div id="navegacion">
<ul>
Historia
GestiónActividades
VespertinoHimno
Profesores
</div>
<div id="contenido">
<!-- <div id="menu">
<ul>
<h1>RECURSOS</h1>
C de Alumnos
C de Padres
R de Evaluación
R de Convivencia
Decretos de Ed.
</div>-->
[contenido no disponible]
<h1>Profesores</h1>
Estos son los docentes que trabajan en nuestro liceo
Director: Señor Hugo Gallegos Alvarado, Doctor en Educación, quien cumple
funciones desde el año 1981, Inspectora General señora María Beatriz Román
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXXX</p>
<!--<h2>Liceo Polivalente Hernando de Magallanes</h2>
</div>
<!--<div id="pie">
<div id="pieuno">
<ul>
Foro
Contacto
Enlaces
</div>
<div id="piedos">Noticias</div>
<div id="pietres">
<ul>
Directorio
TopSite
Mapa de la Web
</div>-->
<div id="curva-inferior"></div>
</div>
</body>
</html>
y en la hoja de estilos:
.centrado{text-align:center}
* {text-indent:0px ; margin:0px ; padding:0px ; border:0px}
p {font-size: 1.0em; color:black; text-align: center}
h1 {font-size: 1.5em; color:black ; font-family:Haettenschweiler; font-weight: bold ; text-decoration: underline ;
text-align: center;padding-top:25px}
h2 {font.size: 0.8em; color:black ; font-weight: bold ; text-decoration: none ;
text-align: center}
body {text-align: center }
body {background-color:white}
#global {width:800px ; margin:4px auto }
#curva-superior {width: 800px ;
height:12px ;overflow: hidden }
#cabecera {background-color: white; border-top:none;border-left: none ;
border-right: none; border-bottom: none; height:85px}
#logotipo {width:70px;float:left}
#publicidad {width:400px ; float:center ; margin-top:25px ; font-size: 18px ;
font-family:Bookman Old Style }
#navegacion {background-color: white ; border: none ; height:20px}
#navegacion li {float:left ; list-style:none ; margin: 0px 25px 0px 25px }
#navegacion ul { margin-left: 60px }
#contenido {background-color: white; border-left: none ;
border-right: none; padding-top:50px }
#contenido p {margin: 25px 55px 25px 55px ; text-indent: 50px; text-align:justify}
#menu {width: 150px ; float:right ;
text-align:left ; margin: 3px 10px 3px 3px ;
background-image:none;
background-position:bottom;
padding-bottom:5px}
#menu li {list-style:none ; margin: 4px 8px 4px 6px }
#menu h1 {text-decoration:none;font-size:12px;padding-top:12px;
background-image:none;
width:150px }
#pie { background-color: white;
border-left: black 1px solid ;
border-right: black 1px solid;
border-top: black 1px solid;
height: 65px}
#pieuno {background-color:silver;float:left;width:150px}
#pie li {{list-style:none;font-size:12px}
#piedos {background-color:silver;float:left;width:498px}
#pietres {background-color:silver;float:left;width:150px}
#curva-inferior { background-image: none ;
background-repeat: no-repeat ;
width: 800px ;
height:12px ;
overflow: hidden }
a {color: black ; text-decoration:none ; display: block }
a:link {}
a:visited {}
a:hover {color:brown ; text-decoration:underline ; background-color: none}
a:active {}
#pie a {color: black; text-decoration:none ; display: block }
#pie a:link {}
#pie a:visited {}
#pie a:hover {color:brown ; text-decoration:underline ; background-color: white }
#pie a:active {color:brown}
#logotipo a {}
#logotipo a:link {}
#logotipo a:visited {}
#logotipo a:hover {background-color: white }
#logotipo a:active {}
a.texto {font-weight:bold ; font-sixe:12px ; text-decoration: none ; }
a.texto:LINK { ;}
a.texto:VISITED { ;}
a.texto:HOVER {color:red ; }
a.texto:ACTIVE {text-decoration: underline ; }
(lo que está en rojo es lo que agregué)
pero aun asi el texto me queda separado del párrafo y yo quiero que quede dentro del mismo.
que he hecho mal????
ojala me puedas ayudar por favoor.Hola,
yaneth, yo creo que era asi:
.texto a {font-weight:bold ; font-sixe:12px ; text-decoration: none ; }
.texto a:LINK { ;}
.texto a:VISITED { ;}
.texto a:HOVER {color:red ; }
.texto a:ACTIVE {text-decoration: underline ; }
pruebalo asi i dices
vale?
nosaber
es que... le faltó agregar
display:inline
la propiedad display se hereda, y por eso lo toma en todos los grupos de "a" que ponga, a menos claro, que indique lo contrario con el inline
cuando pusimos esto
a {color: black ; text-decoration:none ; display: block }
definiste color negro, decoracion ninguno y display block
a:link {}
a:visited {}
a:hover {color:brown ; text-decoration:underline ; background-color: none}
a:active {}
le dijimos quie...a tooodos los enlaces les dariamos esas caracterisitcas.
a menos que se indique lo contrario, por ejemplo
aqui
a.texto {font-weight:bold ; font-sixe:12px ; text-decoration: none ; }
definiste negrita (pero no color, entonces toma el de arriba (negro), tamaño de letra 12px, y decoration none (como arriba ya lo habias puesto, aqui no era necesario, ya que se hereda, y como no definiste ningun display, te toma el de arriba block, si no lo quieres aqui, especificalo con
display:inline
a.texto:LINK { ;}
a.texto:VISITED { ;}
a.texto:HOVER {color:red ; }
a.texto:ACTIVE {text-decoration: underline ; }
Solucionado muchísimas gracias!!!!
