Foros del Web » Creando para Internet » CSS »

Problema con Obtención de Archivo .css

Estas en el tema de Problema con Obtención de Archivo .css en el foro de CSS en Foros del Web. Hola: Me he descargado una página web para hacer una prueba y no me funciona en mi ordenador por más que lo intento. Al comienzo ...
  #1 (permalink)  
Antiguo 03/09/2006, 04:05
 
Fecha de Ingreso: noviembre-2005
Mensajes: 825
Antigüedad: 12 años, 1 mes
Puntos: 8
Problema con Obtención de Archivo .css

Hola:

Me he descargado una página web para hacer una prueba y no me funciona en mi ordenador por más que lo intento.

Al comienzo de la declaración de estilo, aparece la siguiente leyenda

@import url(css.css)

Conozco esta sintáxis y sé que hace referencia a otro archivo .css (el css) que sirve para solventar problemas de compatibilidad con otros navegadores.

El caso es que me gustaría si existe forma de acceder a este archivo css.css, aunque ya me imagino que no.

Estoy casi convencido de que contiene propiedades para hacer que el juego presentado en la página funcione con IE. Con FF funciona perfectamente (viéndolo en Internet, porque si me lo descargo e intento hacerlo funcionar en el ordenador, no hay manera y la imagen que debe hacer de rollover rápido no aparece por ninguna parte).

Si queréis verlo vosotros mismos, está en http://test.newplasticarts.co.uk/css-rollover/

Me estoy volviendo loco con el dichoso tema y no logro solucionarlo. He mirado en todas partes y estoy convencido de que se trata de que falta código css, que debe estar en ese archivo @import url(css.css).

¿Alguien conoce la solución a este problema?

Gracias
  #2 (permalink)  
Antiguo 03/09/2006, 04:32
Avatar de JavierB
Colaborador
 
Fecha de Ingreso: febrero-2002
Ubicación: Madrid
Mensajes: 25.052
Antigüedad: 15 años, 10 meses
Puntos: 771
Hola JUMASOL

Supongo que te refieres a este archivo:

http://test.newplasticarts.co.uk/css-rollover/css.css

Saludos,
  #3 (permalink)  
Antiguo 03/09/2006, 05:47
 
Fecha de Ingreso: noviembre-2005
Mensajes: 825
Antigüedad: 12 años, 1 mes
Puntos: 8
Hola y muchas gracias JavierB:

Efectivamente, qué tontería, ese era el archivo.

Lo he metido en el html y me da el resultado de que aparece el botón cubriendo el enlace de texto, aunque con el problema anterior que afecta a IE, consistente en que, al quitar el ratón del botón, no se quita el Over. Aunque es el resultado que se mostraba en Internet.

Por otro lado, lo que antes funcionaba en FF, ahora no, ya que con el pedazo de código que he insertado ni siquiera sale la imagen img.gif

Seguramente será otra tontería como lo anterior de localizar el archivo .css, pero yo no sé cómo solucionarla.

El código ha quedado así:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<HTML><HEAD><TITLE>lorem ipsum inc</TITLE>
<META http-equiv=Content-Type content="text/html; charset=iso-8859-1"><br>
<META content="MSHTML 6.00.2800.1555" name=GENERATOR></HEAD>
<style type="text/css">

/*\*//*/

p#principle {
height: 290px;
overflow: visible !important;
}

/**/

body {
margin: 2em 3em;
background: #fff;
color: #000;
font: 1em/1.66 serif;
}

p#principle {
height: 290px;
overflow: hidden;
}

a {
position: relative;
display: block;
width: 100px;
height: 50px;
}

a span {
position: absolute;
display: block;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 10;
background-image: url(How to create a CSS rollover link_files/img.gif);
background-repeat: no-repeat;
background-position: 0% 0%;
}

a:focus span,
a:hover span {
background-position: 0% 100%;
}

</style></head><body>
<h1>How to create a CSS rollover link</h1>

<hr>

<h2>The CSS rollover link:</h2>

<p><a href="http://test.newplasticarts.co.uk/css-rollover/">Link Text<span></span></a></p>

<hr>

<h2>The image:</h2>

<p><img src="How%20to%20create%20a%20CSS%20rollover%20link _files/img.gif" alt="" height="100" width="100"></p>

<hr>

<h2>The principle:</h2>

<p id="principle"><img src="How%20to%20create%20a%20CSS%20rollover%20link _files/css_rollover.gif" alt="How to create a CSS rollover link." height="668" width="630"></p>

<hr>

<h2>The explanation:</h2>

<ul>
<li>The <code>anchor</code> is given a certain size.</li>
<li>The <code>span</code> is set to fill the area of the <code>anchor</code> and positioned directly over the <code>anchor</code> area.</li>
<li>The <code>background-image</code> in the <code>span</code> element obscures the HTML text beneath it.</li>
<li>When the <code>anchor</code> <em>is not</em> being focused or hovered over, the <code>background-image</code> in the <code>span</code> element is positioned so that the 'off' area is showing.</li>
<li>When the <code>anchor</code> <em>is</em> being focused or hovered over, the <code>background-image</code> in the <code>span</code> element is positioned so that the 'over' area is showing.</li>
</ul>

<p>Additional states can be added to the image, such as 'visited' and 'active'.<br>
Adding additional states may require you to adjust the background-position values for all states in the CSS.</p>
<hr>

<h2>The markup:</h2>

<pre><code>&lt;a href="..."&gt;Link text&lt;span&gt;&lt;/span&gt;&lt;/a&gt;</code></pre>

<hr>

<h2>The CSS:</h2>

<pre><code>a {
position: relative;
display: block;
height: 100px;
width: 200px;
}

a span {
position: absolute;
top: 0px;
left: 0px;
height: 100%;
width: 100%;
z-index: 10;
background-image: url(How to create a CSS rollover link_files/img.gif);
background-repeat: no-repeat;
background-position: 0% 0%;
}

a:focus span,
a:hover span {
background-position: 0% 100%;
}</code></pre>

<hr>


</BODY></HTML>

¿Me podrías decir dónde está el error?

Además, ¿hay forma de solucionar la falta de funcionalidad en IE? Ello es esencial, ya que, de otro modo, no interesa este sistema.

Gracias y perdona por mi incompetencia.
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 04:27.