Foros del Web » Creando para Internet » CSS »

Diferentes estilos en el mismo div?

Estas en el tema de Diferentes estilos en el mismo div? en el foro de CSS en Foros del Web. Pués eso, quisiera saber si hay aalguna de forma de poner distitnos estilos encerrados en un mismo div ya que así usaría el menor número ...
  #1 (permalink)  
Antiguo 21/03/2011, 11:34
Avatar de kiM-  
Fecha de Ingreso: mayo-2008
Mensajes: 191
Antigüedad: 9 años, 6 meses
Puntos: 2
Diferentes estilos en el mismo div?

Pués eso, quisiera saber si hay aalguna de forma de poner distitnos estilos encerrados en un mismo div ya que así usaría el menor número posibles de div. por ejemplo, quiero que un texto sea de 16px y color blanco en bold, pero que justo debajo haya un texto que sea de 12px y color blanco en normal. También quisiera saber si es posible colocar más de un borde, fondo, etc...

Saludos y gracias!
  #2 (permalink)  
Antiguo 21/03/2011, 11:43
Avatar de gVenom  
Fecha de Ingreso: julio-2008
Ubicación: Costa Rica
Mensajes: 1.455
Antigüedad: 9 años, 5 meses
Puntos: 53
Respuesta: Diferentes estilos en el mismo div?

Lo que solicitas esta muy generalizado y un poco confuso, ya que hablas de poner estilos al DIV pero mencionas parametros para textos.
La forma correcta de diseñar implicaria que uses estilos para texto separados de los estilos de los div. Por ejm, si quieres un texto de 16px blancos y en Bold, mejor especifica un h2 con ese estilo:
Código CSS:
Ver original
  1. h2{font-size:16px #fff bold}

El tema de los bordes, tu puedes especificar un estilo, color y diseño distinto para cada uno de los 4 bordes individualmente. Para eso utiliza
border-top-width
border-right-width
border-bottom-width
border-left-width
__________________
"Al que venciere y guardare mis obras hasta el fin, yo le daré autoridad sobre las naciones."
Apocalipsis 2: 26
Servicios para Pymes http://dst.co.cr
  #3 (permalink)  
Antiguo 21/03/2011, 11:50
Avatar de kiM-  
Fecha de Ingreso: mayo-2008
Mensajes: 191
Antigüedad: 9 años, 6 meses
Puntos: 2
Respuesta: Diferentes estilos en el mismo div?

Gracias, lo que también quiero saber y para simplificar un poco es por ejemplo hacer un div con un color de fondo, y en laa parte de arriba un fondo, en la de abajjo otro y en la del medio otro, todo en el mismo div

En cuanto a lo del texto, si quisiera poner más de un texto diferente debería usar h1, h2, h3.. ¿no? ¿hay más o solo están esos?

Saludos y gracias
  #4 (permalink)  
Antiguo 21/03/2011, 11:54
Avatar de sanxuan  
Fecha de Ingreso: enero-2011
Ubicación: Gijón
Mensajes: 671
Antigüedad: 6 años, 11 meses
Puntos: 36
Respuesta: Diferentes estilos en el mismo div?

Puedes hacerlo de varias formas. Puedes usar etiquetas <span> o <p> para delimitar algunas partes del texto y aplicarles una clase. A esto le puedes añadir antes del selector la clase o el id del div con lo que puedes definir para las mismas etiquetas distintos estilos css.
Por ejemplo:
#div1 .normal{... css para texto blanco normal...}
#div2 .normal{... css para texto azul normal en otro div...}
Para conocer todo el repertorio de selectores puedes usar un manual de css como este
  #5 (permalink)  
Antiguo 21/03/2011, 12:00
Avatar de gVenom  
Fecha de Ingreso: julio-2008
Ubicación: Costa Rica
Mensajes: 1.455
Antigüedad: 9 años, 5 meses
Puntos: 53
Respuesta: Diferentes estilos en el mismo div?

partir un div en 3 colores ??? que rayos estas diseñando ???
Bueno, el punto es que si se puede, por ejm, puedes declarar 3 clases diferentes para cada color

Código CSS:
Ver original
  1. .color1{background-color: #fofofo}
  2. .color2{background-color: #abc256}
  3. .color3{background-color: #000}

y luego aplicarselo a cada div:

Código HTML:
Ver original
  1. <div class="color1">
  2.   <div class="color2">
  3.      <div class="color3">
  4.                </div>
  5.               </div>
  6.              </div>

y algo parecido para los textos pero aplicandole estilos a los parrafos.
__________________
"Al que venciere y guardare mis obras hasta el fin, yo le daré autoridad sobre las naciones."
Apocalipsis 2: 26
Servicios para Pymes http://dst.co.cr
  #6 (permalink)  
Antiguo 21/03/2011, 12:09
Avatar de kiM-  
Fecha de Ingreso: mayo-2008
Mensajes: 191
Antigüedad: 9 años, 6 meses
Puntos: 2
Respuesta: Diferentes estilos en el mismo div?

@sanxuan ¿Y cómo sabe la etiqueta <span> quiés es div1 y div2? ¿Van pro orden?

@gVenom eso ya serían 3 divs, yo lo quiero solo en uno a ser posible :\

Saludos y graaacias!
  #7 (permalink)  
Antiguo 21/03/2011, 12:31
Avatar de gVenom  
Fecha de Ingreso: julio-2008
Ubicación: Costa Rica
Mensajes: 1.455
Antigüedad: 9 años, 5 meses
Puntos: 53
Respuesta: Diferentes estilos en el mismo div?

Cita:
Iniciado por kiM- Ver Mensaje

@gVenom eso ya serían 3 divs, yo lo quiero solo en uno a ser posible :\
O sea meter los 3 colores con un solo div
Diay pues ponle una imagen de fondo que sea de 3 colores y listo
__________________
"Al que venciere y guardare mis obras hasta el fin, yo le daré autoridad sobre las naciones."
Apocalipsis 2: 26
Servicios para Pymes http://dst.co.cr
  #8 (permalink)  
Antiguo 21/03/2011, 12:34
Avatar de kiM-  
Fecha de Ingreso: mayo-2008
Mensajes: 191
Antigüedad: 9 años, 6 meses
Puntos: 2
Respuesta: Diferentes estilos en el mismo div?

Creo que me estoy complicando demasiado, la idea de usar cuántos menos div puede no ir bien, así que usaré los que tenga que usar xD, gracias!
  #9 (permalink)  
Antiguo 21/03/2011, 12:39
Avatar de gVenom  
Fecha de Ingreso: julio-2008
Ubicación: Costa Rica
Mensajes: 1.455
Antigüedad: 9 años, 5 meses
Puntos: 53
Respuesta: Diferentes estilos en el mismo div?

Cita:
Iniciado por kiM- Ver Mensaje
Creo que me estoy complicando demasiado, la idea de usar cuántos menos div puede no ir bien, así que usaré los que tenga que usar xD, gracias!
Mucho mejor >D
__________________
"Al que venciere y guardare mis obras hasta el fin, yo le daré autoridad sobre las naciones."
Apocalipsis 2: 26
Servicios para Pymes http://dst.co.cr
  #10 (permalink)  
Antiguo 21/03/2011, 13:54
Avatar de sanxuan  
Fecha de Ingreso: enero-2011
Ubicación: Gijón
Mensajes: 671
Antigüedad: 6 años, 11 meses
Puntos: 36
Respuesta: Diferentes estilos en el mismo div?

Las etiquetas <span> no saben mucho, pero saben dentro de quién se encuentran.
Supón el siguiente html:
<div id="div1"><span>...</span></div>
<div id="div2"><span>...</span></div>
y un css como:
#div1 span{color:green;}
#div2 span{color:red;}
Los span de div1 hacen que el texto se muestre verde, los de div2 serán de color rojo.
Sin hacer uso de las clases puedes hacer bastantes combinaciones para diferentes span del mismo div o diferentes propiedades para el mismo span dentro de distintos div.
Puedes usar el fondo, bordes y otras propiedades en muchas etiquetas, no solo en los div.

Etiquetas: diferentes, estilos
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 09:51.