Regresar a la página www.ComoCrearTuWeb.com
Resultados 1 al 4 de 4

Tema: COMO HACER CAPA CON TEXTO E IMAGENES.............

  1. #1
    Me va gustando esto... Habitante
    Fecha de Ingreso
    11 dic, 08
    Mensajes
    69
    Poder de Reputación
    14

    COMO HACER CAPA CON TEXTO E IMAGENES.............

    Hola, estoy siguiendo el curso desde la semana pasada, y la verdad es que sin haber tenido ni idea, me ha valido de mucho. He terminado ya la web de ejemplo (lastima que solo llegue a la leccion 4) y he empezado con una web personal.
    Esta es la web de ejemplo:

    http://webcctvejemplo.mywebcommunity.org/

    Los problemas que estoy teniendo con la web personal (aun no esta en red) son muchos y variados, pero ahora mismo lo que mas me llama la atención es como poder hacer capas de la siguiente forma:
    que este dividida o similar (de forma oculta la division) en 2 celdas, 1 a la izquierda y otra a la derecha, que en ambas celdas se pueda colocar bien texto bien imagen, pero que no sea forzoso colocar imagen o texto. Pero no me estoy confundiendo con tablas,y a la par tambien querria que en algun momento solo poner una unica foto (o texto) centrado.
    De momento a lo mas que he llegado ha sido a colocar imagenes a la izquierda y a la derecha. Gracias por leerme y por esta web que nos sirve de aprendizaje a muchos.

    Este es el código de imagen que no me gusta como queda:



    [img]objetos/ParqueElCapricho/CasaDeLaVieja.jpg[/img]</P>


    [img]objetos/ParqueElCapricho/PuentedeHierro.jpg[/img]</P>


    [img]objetos/ParqueElCapricho/CasaDeLasCañas.jpg[/img]</P>


    [img]objetos/ParqueElCapricho/BateriaOFortin.jpg[/img]</P>


    [img]objetos/ParqueElCapricho/CasinoDeBaile.jpg[/img]</P>


    [img]objetos/ParqueElCapricho/EstanqueDePatos.jpg[/img]</P>


    [img]objetos/ParqueElCapricho/IslaYMonumentoAlIIIDuqueDeOsunaIII.jpg[/img]</P>


    [img]objetos/ParqueElCapricho/Fuente.jpg[/img]</P>

  2. #2
    Moderador CCTW Habitante Avatar de Yaneth
    Fecha de Ingreso
    27 abr, 07
    Ubicación
    Mèxico
    Mensajes
    10,701
    Poder de Reputación
    69
    hola

    eso que deseas es mas facil hacerlo con tablas, aunqe con divs tambien se puede hacer

    mira con divs va mas o menos asi

    pones una div que contenga ambas cosas (imagenes y texto)
    luego dentro de ella una div para imagenes y otra para el texto
    y te quedaria mas o menos asi

    <div id="contienen">
    <div id="imagen">aqui metes la imagen</div>
    <div id="texto>aqui metes el texto</div>
    </div>

    esto es para que tengas las cosas ordenadas
    solo recuerda que debes darle anchos fijos
    por ejemplo tu div de imagen qe mida 200px y la de texto
    300px de ancho entonces.... la div que conteiene la dos deberia ser un poco mas ancha de 500px

    asi

    #contienen {width: 510px; float: left;}
    #imagen {width: 200px; float: left}
    #texto {width: 300px; float: left}

    ahora solo debes tener cuidado con el ancho de las imagenes
    no deberia se mayor que 200px me explico???????

    saludos
    ______________________________________

    reparacion de rines


    _____________________________________

  3. #3
    Me va gustando esto... Habitante
    Fecha de Ingreso
    11 dic, 08
    Mensajes
    69
    Poder de Reputación
    14
    Pues muchas gracias por tu pronta respuesta.
    Lo he adaptado a mi web y me ha solucionado el problema.

    Y asi es como me queda.

    #contienen {width: 796px;float: right}
    #imagen {width:300px ; float: right;margin: 0px 10px 0px 0px}
    #texto {width: 466px; float: left}

    <div id="contienen">
    <div id="imagen">[img]objetos/ParqueElCapricho/PuentedeHierro.jpg[/img]</div>
    <div id="texto">

    Considerado uno...........bla bla bla.</div>
    </P></div>
    Lo que hare sera sustituir "contienen" por otras dos capas que llamaré "contienen izquierda" y "contienen derecha". Así intercambiaré su orden. Supongo que para otra tercera "Contienen centro" será de la misma forma. Todo depende de las necesidades de la página que vaya construyendo.

    Tengo otra pregunta ahora, pero creo que cada pregunta hay que hacerla en el foro como un nuevo tema, si es así dimelo cuando puedas y así lo hare (es sobre titulos o pies o procedencia de fotos).

  4. #4
    Me va gustando esto... Habitante
    Fecha de Ingreso
    11 dic, 08
    Mensajes
    69
    Poder de Reputación
    14
    Hola, he adaptado/mejorado mi capa de imágenes y texto, y ahora queda así:

    <div id="contienen-izquierda">
    <div id="imagen-izquierda">[img]objetos/ParqueElCapricho/EstanqueDePatos.jpg[/img]</div>
    <div id="texto-derecha">

    Estanque</P></div>
    </div>
    <div id="contienen-derecha">
    <div id="imagen-derecha">[img]objetos/ParqueElCapricho/ErmitaYPiramide.jpg[/img]</div>
    <div id="texto-izquierda">

    Ermita y pirámide en un lateral.</P></div>
    </div>

    son dos tipos de capas, una para la imagen a la izquierda y otra a la derecha (obvio segun se lee) y además he conseguido averiguar (que no lo recordaba y pensaba que no lo sabía) como hacer que salga una frase en la foto al poner el ratón sobre ella (de primeras lecciones del curso que las había olvidado, e igual para abrir la foto en otra página mas grande).

Temas Similares

  1. como centrar texto en capa div
    Por Marttyn en el foro Webs con Capas o DIVS
    Respuestas: 10
    Último Mensaje: 28/11/2013, 01:33
  2. ¿Cómo centrar un texto en la capa (layer)?
    Por yaka_1989 en el foro Foro General
    Respuestas: 1
    Último Mensaje: 30/10/2009, 15:52

Permisos de Publicación

  • No puedes crear nuevos temas
  • No puedes responder temas
  • No puedes subir archivos adjuntos
  • No puedes editar tus mensajes
  •