Duda sobre CSS
5 seguidores
Yo hago las hojas de estilo con dreamweaver mx (lo siento, lo siento, pero por desgracia no tengo a nadie q me enseñe otra forma....) y el caso es que cuando hago varias hojas de estilo en un documento en concreto, no me funcionan. POr ejemplo: creo dos hojas de estilo para dos links distintos. Pues la primera prevalece sobre la segunda, es decir , le aplico la segunda al link y no me hace ni puto caso, se mantiene la primera....y no os quiero ni contar cuando importo la hoja de estilo creada aparte.......ahi ya no me cuadra nada. Supongo que lo hago mal.
Como lo puedo hacer??????
Gracias y salu2
meddle
si puedes colgar el codigo por ahi mejor ;)
prenda
Creo que sé lo que te está pasando. Aunque apliques dos hojas de estilo distintas, en realidad, en ambas estás poniendo a{ contenido }.
Hay dos formas básicas de crear un estilo. Con relativo a un tipo de objeto, que es lo que creo que has hecho:
- si quieres aplicarlo a un link, pones a{ ... }, a un hr, hr{ ... }, etc.
o ponerle un nombre de clase (con un punto delante) y aplicarlo al elemento con el que lo quieras usar:
- .color_rojo{ ... }
y luego, en la etiqueta, <a href="..." class="color_rojo">link</a>
Si quieres aplicar distintos estilos a tus enlaces, debes usar la segunda opcion.
Creo que ese es el problema. En caso contrario, muéstranos el código
Salu2.
molusco
ok, ok....voy a hacer una prueba cutr pa que veais como lo hago normalmente y os pongo el código, ok??
Gracias
molusco
vale, seguramente este todo mal....no tengo mucha experiencia en hojas de estilo, sobre todo cuando hay varias, pero os pongo el codigo ok??
Trabajo con dreamweaver mx....por si os sirve de algo.
No os riais de mi :-p
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
.body {
font: 11px Verdana, Arial, Helvetica, sans-serif;
color: #336633;
text-decoration: none;
}
.link1 {
font: bold 10px Verdana, Arial, Helvetica, sans-serif;
color: #FF0000;
text-decoration: none;
}
a:link {
font: bold 10px Verdana, Arial, Helvetica, sans-serif;
color: #FF0000;
text-decoration: none;
}
a:hover {
font: bold 10px Verdana, Arial, Helvetica, sans-serif;
color: #FF0000;
text-decoration: underline;
}
.link2 {
font: normal 12px Arial, Helvetica, sans-serif;
color: #006699;
text-decoration: none;
}
b:link {
font: bold 12px Arial, Helvetica, sans-serif;
color: #006699;
text-decoration: none;
}
b:hover {
font: bold 12px Arial, Helvetica, sans-serif;
color: #006699;
text-decoration: underline;
}
-->
</style>
</head>
<body>
<table width="50%" border="0" align="center" cellpadding="5" cellspacing="0">
<tr>
<td class="body">Hoja de estilo para texto normal.</td>
</tr>
<tr>
<td><a href="#" class="link1">Link 1</a></td>
</tr>
<tr>
<td><a href="#" class="link2">Link 2</a></td>
</tr>
</table>
</body>
</html>
prenda
Vale, creo que hemos dado con la solución. Como te decía, el problema es el uso de "a" en vez de ".nombre_de_clase"
<code>a:link {
font: bold 10px Verdana, Arial, Helvetica, sans-serif;
color: #FF0000;
text-decoration: none;
}
a:hover {
font: bold 10px Verdana, Arial, Helvetica, sans-serif;
color: #FF0000;
text-decoration: underline; }</code>
La "a" se refiere al tipo de tag al que se aplicará el estilo, es decir, <code><a href="pepe.htm">PEPE</a></code>
El que has nombrado como "b" no existe porque no hay tags de tipo "b".
Cambia la "a" por ".enlace1" y la "b" por ".enlace2"
En los enlaces de tu página coloca <code><a href="pepe1.htm" class="enlace1">PEPE1</a></code> ó <code><a href="pepe2.htm" class="enlace2">PEPE2</a></code> según corresponda.
los estilos han de quedarte, por ejemplo, así:
<code>.enlace1:link {
font: bold 10px Verdana, Arial, Helvetica, sans-serif;
color: #FF0000;
text-decoration: none;
}
.enlace1:hover {
font: bold 10px Verdana, Arial, Helvetica, sans-serif;
color: #FF0000;
text-decoration: underline; }
.enlace2:link {
font: bold 12px Verdana, Arial, Helvetica, sans-serif;
color: #0000FF;
text-decoration: none;
}
.enlace2:hover {
font: bold 12px Verdana, Arial, Helvetica, sans-serif;
color: #0000FF;
text-decoration: underline;
}</code>
¿Okis?. Y no te preocupes que no se nace sabiendo.
Salu2.
molusco
oka....voy a probar....
gracias...............no se que haria sin vosotros!!!!!!!!!
molusco
Vale, ahora si que veo los diferentes estilos, pero el hover no me funciona. Pongo codigo pa ver que pasa.............
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
.body {
font: 11px Verdana, Arial, Helvetica, sans-serif;
color: #336633;
text-decoration: none;
}
.enlace1 {
font: bold 10px Verdana, Arial, Helvetica, sans-serif;
color: #FF0000;
text-decoration: none;
}
enlace1:link {
font: bold 10px Verdana, Arial, Helvetica, sans-serif;
color: #FF0000;
text-decoration: none;
}
enlace1:hover {
font: bold 10px Verdana, Arial, Helvetica, sans-serif;
color: #FF0000;
text-decoration: underline;
}
.enlace2 {
font: normal 12px Arial, Helvetica, sans-serif;
color: #006699;
text-decoration: none;
}
enlace2:link {
font: bold 12px Arial, Helvetica, sans-serif;
color: #006699;
text-decoration: none;
}
enlace2:hover {
font: bold 12px Arial, Helvetica, sans-serif;
color: #006699;
text-decoration: underline;
}
-->
</style>
</head>
<body>
<table width="50%" border="0" align="center" cellpadding="5" cellspacing="0">
<tr>
<td class="body">Hoja de estilo para texto normal.</td>
</tr>
<tr>
<td><a href="#" class="enlace1">Link 1</a></td>
</tr>
<tr>
<td><a href="#" class="enlace2">Link 2</a></td>
</tr>
</table>
</body>
</html>
Mystral
em......... igual es que se te ha olvidao poner los estilos en los enlaces......... jejeje ^_^
Klein
.enlace2:link
.enlace2:hover
Te falta el punto delante de enlace2, etc
prenda
Además del apunte de Klein, has de cambiar esto:
<code>
<td>Link 1</td>
</tr>
<tr>
<td>Link 2</td>
</code>
por esto
<code>
<td><a href="pagdestino1.htm" class="enlace1">Link 1</a></td>
</tr>
<tr>
<td><a href="pagdestino2.htm" class="enlace2">Link 2</a></td>
</code>
Venga, que ya casi lo tenemos!
molusco
oooooppppppsssssssss!!!!!!!!!!
Valeeee, ya me he cocao, jejejejej....tonta, tonta, tonta!!!! :-P
molusco
lo he cambiado y funciona.
Gracias.........como veis, hoy estoy gilip.........
Muchas gracias ;-P
prenda
Nada, mujé, una mala tarde la tiene cualquiera!...