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

Tema: Consejo con colores y CSS y ayuda con las AES #a {}

  1. #1
    Me va gustando esto... Habitante
    Fecha de Ingreso
    02 dic, 08
    Mensajes
    96
    Poder de Reputación
    20

    Consejo con colores y CSS y ayuda con las AES #a {}

    Hola voy mejoranbdo pero ahora necesito un consejo, en la pagina que ahora estoy haciendo que es igual a otras muchas y depende de una principal, me ha surgido unas dudas, os cuento.

    Tengo un contenido y dento de el varios 3 div claro yo quiero que tenga todo el mismo color, por eso les pongo a todos ellos el mismo color, pero.... quiero que cada pagina que haga tenga un color diferente, entonces me surge la duda, o lleno toda la hoja css de codigo poniendo a cada div un color cambiadolos de nombre tanto en el codigo HTML y CSS o tambien se me ha ocurrido que cada pagina o grupo de paginas tenga una hoja independiente CSS.

    Que es mejor???

    Por otro lado, me estoy volviendo loco con las AES o sea eso de
    #menu a {color: #551A8B; text-decoration: none} por ejemplo, no tengo muchas pero no logro hacer que me hagan caso todas en lo que quiero y eso para mi es muy importante.

    Como lo puedo arreglar para que me funcione correctamente??

    Gracias, Os dejo los codigos.

    HTML
    Código:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
    <html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
    <title>Unidad Pastoral Santa Maria de Olarizu-Caritas</title> 
    <link rel="stylesheet" href="paginas.css" type="text/css" media="all"> 
    <style type="text/css"> 
    <!-- 
    .Estilo1 {color: #E2E2E2} 
    --> 
    </style> 
    </head> 
    
    <body> 
    <div id="global"> 
    <div id="curva-superior"></div> 
    <div id="cabecera"> 
    <div id="logotipo">[img]IMAGENES/logotipoprueba.jpg[/img]</div> 
    <div id="publicidad">[img]IMAGENES/banner.jpg[/img]</div> 
    </div> 
    <div id="navegacion"> 
    <ul> [*]Qué somos [*]Dónde estamos [*]Contacto [*]Documentos de interés [*]Foro [*]Inicio [/list]
    </div> 
    <div id="contenido2"> 
    <div id="areamenuizq"> 
    <div id="areas"><h1>AREAS PASTORALES</h1> 
    </div> 
    <div id="menu"> 
    <ul><h1>EDUCACIÓN EN LA FE</h1> [*] Catequesis Familiar [*] Pastoral con Jóvenes [*] Pastoral con Adultos [*] Pastoral Familiar 
    <h2>CELEBRACIÓN DE LA FE Y LITURGIA </h2> [*] Comisi&oacute;n de Liturgia [*] Experiencia de oraci&oacute;n grupal 
    <h2>SOCIO CARITATIVA </h2> [*] Cáritas [*] Comisi&oacute;n Social [*] Comisi&oacute;n de Mayores y Enfermos [*] Misiones y Solidaridad [*] Pastoral Penitenciaria 
    <h2>COORDINACIÓN Y COMUNIÓN</h2> [*] Comisión Económica [*] Agentes de Pastoral [*] Consejo Pastoral 
    <h2>SERVICIOS</h2> [*] Ornamentación y limpieza de las iglesias [/list]
    </div> 
    </div> 
    <div id="areamenuder"> 
    <div id="areasder"><h1>CONTENIDO</h1> 
    </div> 
    <div id="menuder"> 
    <ul><h1>COMISIONES</h1> [*] Acogida [*] Piso de inmigrantes  [*] Promoción de personas adultas [*] Grupo ropero [*] Forum 50 - 70 [/list]
    </div> 
    </div> 
    <div id="escritos"><h2>CÁRITAS</h2> 
    
    
    C&aacute;ritas de la Unidad Pastoral Santa María de Olarizu esta unida a las opciones y líneas de actuación de Caritas Diocesana en el ámbito de la Iglesia Diocesana.</p>
     
    
    
    Desarrolla su actividad en el marco de la  Unidad Pastoral, en el Área socio-caritativa, asumiendo el objetivo del Proyecto de la Unidad pastoral, Tomar conciencia y salir al encuentro de los pobres entre nosotros y hacerles sitio en nuestras comunidades.</p>
     
    
    
    OBJETIVOS</p>
    
    
    
    - Animar y coordinar la acción socio-caritativa en la que participan alrededor de 75 voluntarios</p>
     
    
    
    - Analizar la realidad de pobreza existente en nuestra zona, causas, consecuencias, para intervenir en ella, sensibilizando, denunciando y transmitiendo  a los cristianos la conciencia de que todos somos Caritas y a los hombres y mujeres de buena voluntad de nuestra zona que tenemos el reto de luchar por una vida digna para todas las personas</p>
     
    
    
    JUNTA DE CARITAS</p>
    
    
    
    Esta compuesta por la directora de Caritas, la trabajadora social, el tesorero, el consiliario y  los representantes de la diferentes comisiones o grupos de Caritas.</p>
     
    
    
    Tiene como finalidad animar la acción caritativa de la Zona  sensibilizando, denunciando, conociendo nuevas pobrezas y coordinar las diferentes comisiones y hacer seguimiento de programas y actividades.</p>
     
    </div> 
    </div> 
    <div id="pie">[img]IMAGENES/webamigas.jpg[/img] 
    [img]IMAGENES/gazteok.jpg[/img][img]IMAGENES/diocesisvitoria.gif[/img]<a href="http://www.caritasvitoria.org/" target="_blank">[img]IMAGENES/caritas.jpg[/img]</div> 
    <div id="curva-inferior"></div> 
    </div> 
    </body> 
    </html>
    CSS
    Código:
    * {text-indent:0px ; margin:0px; padding:0px ; border: 0px}
    p {text-align: justify}
    body 	{text-align: center; background-color: #528B8B}
    #global {width: 800px ; margin: 4px auto}
    
    #curva-superior {background-image: url(IMAGENES/curva-superior.gif) ; background-repeat: no-repeat ; width:800px ; 
                      height: 12px ; overflow : hidden}
    				  
    #cabecera {background-color: white ; border-left: black 1px solid ; border-right: black 1px solid ; height:105px}
    #logotipo   {width:260px ; float:left}
    #publicidad {width:538px ; float:right}
    
    #navegacion {background-color: #003366 ; border: black 1px solid ; height:20px}
    #navegacion li {float:left ; list-style:none ; margin: 0px 18px 0px 18px}
    #navegacion ul { margin-left: 60px}
    
    #contenido {width:798px; height:680px; background-color: #C1FFC1; border-left: black 1px solid ; border-right: black 1px solid}
    #contenido1 {width:798px; height:680px; background-color: #C6E2FF; border-left: black 1px solid ; border-right: black 1px solid}
    #contenido2 {width:auto; height:680px; background-color: #FFC1C1; border-left: black 1px solid ; border-right: black 1px solid}
    #contenido3 {width:798px; height:680px; background-color: #F5DEB3; border-left: black 1px solid ; border-right: black 1px solid}
    #contenido4 {width:798px; height:680px; background-color: #FFBBFF; border-left: black 1px solid ; border-right: black 1px solid}
    #contenido5 {width:798px; height:680px; background-image: url(IMAGENES/fondonoticias.jpg); border-left: black 1px solid ; border-right: black 1px solid}
    #contenido6 {width:798px; height:680px; background-image: url(IMAGENES/fondonavegacion.jpg); border-left: black 1px solid ; border-right: black 1px solid}
    
    #areamenuizq{float:left;width:181px;height:680px;background-color:#FFC1C1; margin-left:5px} 
    #areas {float:left; width:180px; height:30px; background-color:#9ACD32; text-align:center; margin-top:10px; } 
    #areas h1 {text-align: center; text-decoration:none ; font-size:13px ; padding-top:6px ; color:#FFFFFF; font-family:Georgia, serif} 
    
    #menu {float:left;background-color:#FFFFFF; width: 180px; text-align:left; margin-top:10px; 
    background-image: url(IMAGENES/menu-parte-inferior-1.gif) ; background-position: bottom ; padding-bottom:20px} 
    #menu li { list-style:none ; font-size:12px; margin: 4px 4px 4px 3px; line-height:14px; font-family:"Trebuchet MS",Helvetica,sans-serif} 
    #menu h1 {text-align: center; text-decoration:none ; font-size:11px ; background-image: url(IMAGENES/menu-curva-superior-1.gif) ; padding-top:11px ; color:black; font-family:Georgia, serif} 
    #menu h2 {text-align: center; text-decoration:none ; font-size:11px ; padding-top:11px ; color:#000000; font-family:Georgia, serif}
    
    #areamenuder{float:right;width:151px;height:680px;background-color:#FFC1C1; margin-right:10px}
    #areasder {float:left; width:150px; height:30px; background-color:#9ACD32; text-align:center; margin-top:10px} 
    #areasder h1 {text-align: center; text-decoration:none ; font-size:13px ; padding-top:6px ; color:#FFFFFF; font-family:Georgia, serif} 
    
    #menuder {float:left;background-color:#FFC1C1; width: 148px; text-align:left; margin-top:10px;background-position: bottom ; padding-bottom:20px; border: gray 1px solid} 
    #menuder li { list-style:none ; font-size:12px; margin: 4px 4px 4px 3px; line-height:14px; font-family:"Trebuchet MS",Helvetica,sans-serif} 
    #menuder h1 {text-align: center; text-decoration:none ; font-size:11px ; padding-top:11px ; color:black; font-family:Georgia, serif} 
    #menuder h2 {text-align: center; text-decoration:none ; font-size:11px ; padding-top:11px ; color:#000000; font-family:Georgia, serif} 
    
    #escritos {background-color:#FFC1C1;margin-left:190px;margin-right:190px}
    #escritos h2 {text-decoration:none ; font-size:25px ; padding-top:11px; padding-bottom:11px; color:#1C6901; font-family:"Comic Sans MS",cursive}
    #escritos h3 {text-decoration:none ; font-size:16px ; color:#003366; font-family:"Comic Sans MS",cursive}
    #escritos p {text-align:justify; text-indent:15px; padding-left:6px; font-size:13px; font-family:"Comic Sans MS",cursive}
    #escritos img {padding-left:10px; padding-right:10px}
    #escritos table {width:500px; border-width:5px; margin-top:10px}
    th {text-align:left; font-size:16px; font-family:"Comic Sans MS",cursive}
    td {text-align:left; font-size:13px; font-family:"Comic Sans MS",cursive}
    
    #grupo1 {width: 200px; height: 150px; float:left; padding-top:10px; padding-left:25px; padding-right:30px}
    #grupo2 {width: 200px; height: 150px; float:left; padding-top:10px; padding-left:30px}
    #grupo3 {width: 200px; height: 150px; float:left; padding-left:25px; padding-top:30px; padding-right:30px}
    #grupo4 {width: 200px; height: 150px; float:left; padding-top:30px; padding-left:30px}
    
    #pie {width: 798px; height: 75px; background-color:#FFFFFF; padding-top:4px; border-left: black 1px solid ; border-right: black 1px solid; border-top: black 1px solid}
    #pie img{float: left; margin-right:6px}
    
    #curva-inferior { background-image: url(IMAGENES/curva-inferior.gif) ; background-repeat: no-repeat ; width:800px ; height: 12px ; overflow : hidden}
    
    #menu a {color: #551A8B; text-decoration: none}
    #menu a:link {}
    #menu a:visited {}
    #menu a:hover {color: #000000; text-decoration: underline; background-color: #D3D3D3}
    #menu a:active 
    #escritos a {color:#FF0000; text-decoration:none}
    #escritos a:link {}
    #escritos a:visited {}
    #escritos a:hover {color:#FFFFFF; text-decoration:none; background-color:#4F4F4F}
    #escritos a:active
    #pie a         {color: blue; text-decoration:none }
    #pie a:link    {}
    #pie a:visited {}
    #pie a:hover   {color:black ; text-decoration:none ; background-color: white }
    #pie a:active  {color:black}
    #navegacion a         {color:white; text-decoration:none }
    #navegacion a:link    {}
    #navegacion a:visited {}
    #navegacion a:hover   {color:#9ACD32; text-decoration:none }
    #navegacion a:active  {color:#9ACD32}
    #menuder a {color: #551A8B; text-decoration: none}
    #menuder a:link {}
    #menuder a:visited {}
    #menuder a:hover {color: #000000; text-decoration: underline; background-color: #D3D3D3}
    #menuder a:active

  2. #2
    Moderador CCTW Habitante Avatar de Yaneth
    Fecha de Ingreso
    27 abr, 07
    Ubicación
    Mèxico
    Mensajes
    10,344
    Poder de Reputación
    74
    ya lo subiste a la red??????

    danos la url de tu web

    saludos
    ______________________________________

    reparacion de rines


    _____________________________________

  3. #3
    Recien Llegado! Habitante
    Fecha de Ingreso
    17 ene, 09
    Ubicación
    Resistencia, Argentina
    Mensajes
    19
    Poder de Reputación
    20
    Hola
    Por lo que contas, parece que queres que los divs sean diferentes en cada pagina o no? Tal vez tengas que hacer una hoja de estilos por cada pagina, o definir el color de los divs directamente en la pagina HTML para no tener varias hojas de estilos por todas las paginas que tengas.
    Esto ultimo me parece que se hace definiendo en la misma pagina HTML las etiquetas <style> y </style> y entre ellas los cambios del estilo que quieras hacer.

    Espero ser de ayuda
    Sublevus

  4. #4
    Me va gustando esto... Habitante
    Fecha de Ingreso
    02 dic, 08
    Mensajes
    96
    Poder de Reputación
    20
    Hola,demomento voy solucionando el tema de los colores poniendo que cada bloque de paginas tenga un .CSS diferente.
    Noseme ocurrio lo deponer el color en lahoja de HTML, lo tendre en cuenta.

    Pongo la url para el temade la AES.

    www.santamariadeolarizu.org/plantilla

    Mañana por la mañana subire los ultimos cambios de los colores y de los nuevos divs que me ayudasteis a solucionar ese tema

    Gracias

  5. #5
    Me va gustando esto... Habitante
    Fecha de Ingreso
    02 dic, 08
    Mensajes
    96
    Poder de Reputación
    20

  6. #6
    Esto empieza a ser un vicio... Habitante
    Fecha de Ingreso
    21 ago, 08
    Mensajes
    393
    Poder de Reputación
    22
    Hola,

    lo que quieres es cambiar el color del div contenido y dejar el menu igual, verdad??? Para eso solo necesitas una y solo una hoja de estilos, ves que el modelo de la hoja es el mismo y lo único que variaría, sería el bg-color del #contenido.

    Ahora, ese cambio de color del background, se hace en la misma hoja html dentro del <head> de la siguiente manera:

    <head>
    <title...
    <link...
    <style type="text/css">
    #contenido {background-color:green}
    </style>
    </head>

    No hay razón para que equivocarse; pondrás la etiqueta styel en cada hoja html donde quieras efectuar el cambio de color; a la siguiente hoja, le puedes poner, ya no green sino, blue, a otra, red y así sucesivamente.

    Lo que no te entiendo bien es el problema que dices tener con las aes. Bueno, ya nos dirás que tal te va con la tag style.

    saludos

Temas Similares

  1. Ayuda o consejo...
    Por Liaranort en el foro Foro General
    Respuestas: 8
    Último Mensaje: 22/02/2010, 22:07
  2. necesiot ayuda con los colores de mi web
    Por Near en el foro Foro General
    Respuestas: 2
    Último Mensaje: 28/03/2008, 00:42

Permisos de Publicación

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