Foros del Web » Creando para Internet » CSS »

Poner imagen y texto encima de un reproductor?

Estas en el tema de Poner imagen y texto encima de un reproductor? en el foro de CSS en Foros del Web. Hola amigos, tengo un reproductor puesto en mi web con position:absolute y las coordenadas esas de top:600px y left:600px (es un ejemplo) Ahora lo que ...
  #1 (permalink)  
Antiguo 24/05/2009, 05:52
Avatar de rompeguesos  
Fecha de Ingreso: marzo-2009
Mensajes: 690
Antigüedad: 8 años, 9 meses
Puntos: 8
Pregunta Poner imagen y texto encima de un reproductor?

Hola amigos, tengo un reproductor puesto en mi web con position:absolute y las coordenadas esas de top:600px y left:600px (es un ejemplo) Ahora lo que me gustaría saber es como puedo poner una imagen y texto pero que se quede por encima del reproductor y el reproductor qedara como si estuviese detras.

Es decir lo que quiero es poner encima del reproductor la imagen y quede como queda el logo de las cadenas de tv que siempre estan hay en la esquinita.

¿Eso es posible?
  #2 (permalink)  
Antiguo 24/05/2009, 07:07
Avatar de rompeguesos  
Fecha de Ingreso: marzo-2009
Mensajes: 690
Antigüedad: 8 años, 9 meses
Puntos: 8
Respuesta: Poner imagen y texto encima de un reproductor?

Bueno amigos deciros que ya lo solucione con la propiedad z-index.

Saludos.
  #3 (permalink)  
Antiguo 24/05/2009, 07:49
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Poner imagen y texto encima de un reproductor?

No es necesario utilizar z-indez.
Mira el siguiente código (sólo me he permitido la "frivolidad" de la transparencia:
Código html:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es-es">
  3. <title>play sobre imagen</title>
  4. <style type="text/css">
  5. html, body {
  6. background-color: #cdcdcd;
  7. }
  8. #contenedor{
  9. background-color: #cdcdcd;
  10. position: absolute;
  11. }
  12. #menu {
  13. position:absolute;
  14. width: 100px;
  15. height:100px;
  16. left: -50px;
  17. top: 50%;
  18. left:50%;
  19. margin-left: -50px;
  20. margin-top:-50px;
  21. opacity: .7;
  22. }
  23. </head>
  24. <div id="contenedor">
  25. <img src="http://share.skype.com/sites/es/skype/skype32ready.jpg" />
  26. <div id="menu">
  27. <img src="http://www.norwichcanoeclub.org.uk/images/Play-icon256-by-nagaya.png" width="100" height="100" />
  28. </div>
  29. </div>
  30. </body>
  31. </html>
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++

Última edición por kseso?; 24/05/2009 a las 07:54
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 16:52.