Foros del Web » Creando para Internet » CSS »

Personalización de las cajas redondeadas

Estas en el tema de Personalización de las cajas redondeadas en el foro de CSS en Foros del Web. He cogido el código de una caja de bordes de aquí, y funciona de maravilla. Parte de su css es ( creo que es de ...
  #1 (permalink)  
Antiguo 17/04/2009, 04:33
 
Fecha de Ingreso: marzo-2009
Mensajes: 171
Antigüedad: 15 años
Puntos: 4
Personalización de las cajas redondeadas

He cogido el código de una caja de bordes de aquí, y funciona de maravilla. Parte de su css es ( creo que es de Milkoro)

Código:
.caja {margin: 20px auto;
background-color: #43758C;
width: 200px;
position: relative;
}
.punto {font-weight: bold;
color: #43758C;  --------------->sólo quiero modificar esto.
position: absolute;
font-size: 60px;
background-color: transparent;
line-height: 18px;
}
.bottom, .top {height: 10px;
background-color: #43758C;
position: absolute;
left: 10px;
right: 10px;
width: 90%;
}
Si necisitáis más código lo pongo pero creo que no hace falta, sólo puse la parte donde aparece.

Para cargarlo pongo
Código:
<div class="caja caja_top"> 
			  <div class="punto lt">&bull;</div>
			  <div class="top"></div>
			  <div class="punto rt">&bull;</div>
			  <div class="punto lb">&bull;</div>
			  <div class="bottom"></div>
			  <div class="punto rb">&bull;</div>
			  <div class="texto blanco negrita">ACCESO</div>
</div>
Pero si quiero cambiar el color me veo obligado a poner
Código:
<div class="caja caja_menu_horizontal" style="background-color:#CBD6EC"> 
	<div class="punto lt" style="color:#CBD6EC">&bull;</div>
	<div class="top" style="background-color:#CBD6EC"></div>
	<div class="punto rt" style="color:#CBD6EC">&bull;</div>
    <div class="punto lb" style="color:#CBD6EC">&bull;</div>
	<div class="bottom" style="background-color:#CBD6EC"></div>
	<div class="punto rb" style="color:#CBD6EC">&bull;</div>
	<div class="contenido_menu_horizontal"> 
	  <div class="texto"> 
	  		contenido
	  </div>
 	</div>
</div>
Y eso porque no tengo la posibilidad de poner una tercera clase en la llamada, es decir, algo como:
<div class="punto lt colorCBD6EC">&bull;</div>

en vez de

<div class="punto lt" style="color:#CBD6EC">&bull;</div>

Si quiero evitar la llamada style pero no deseo declarar una nueva clase, por ejemplo, la clase "punto", ya que sólo quiero modificar una propiedad, la de color, ¿¿¿cómo puedo hacer????
  #2 (permalink)  
Antiguo 17/04/2009, 09:14
Avatar de Calizman
Organiza competencias CSS
 
Fecha de Ingreso: octubre-2008
Ubicación: Ciudad de Guatemala, Guatemala
Mensajes: 1.122
Antigüedad: 15 años, 5 meses
Puntos: 83
Respuesta: Personalización de las cajas redondeadas

Saludos!!

No se si entiendo bien... pero te pregunto: ¿Porque no simplemente cambias color: #43758C; por color:#CBD6EC; ?

El primero lo saque de tu CSS en .punto y el segundo lo saque de el style=""
__________________
[ Mi Sitio Personal ]
"La felicidad no es una estacion de llegada... Es un modo de viajar"
Tom Schreiter
  #3 (permalink)  
Antiguo 18/04/2009, 02:19
 
Fecha de Ingreso: marzo-2009
Mensajes: 171
Antigüedad: 15 años
Puntos: 4
Respuesta: Personalización de las cajas redondeadas

Eso es lo que hago por ahora, es decir yo tengo una clase

.punto{
...;
background-color: #ca0000;

}
.lt{
color: #ca0000;
}

.colorCBD6EC{
#CBD6EC;
}

Yo si quiero sacar la caja por defecto me va a salir con el color #ca0000 en todos los divs que haya, si quiero sacar otro color modifico cada div poniendo

<div class="punto lt" style="color:#CBD6EC">&bull;</div> añadiendo la propiedad style para quitar #ca0000 por defecto y poner #CBD6EC.

Lo que pregunto es si hay alguna manera de evitar la propiedad style es estos casos sin tener que replicar otras clases para poner la caja en otro color algo como:

<div class="punto lt colorCBD6EC">&bull;</div>


Si no es así pregunto, ¿es mejor utilizar la propiedad style o reduplicar con otras clases?. Lo pregunto por eso de ser estricto con el estandar.
  #4 (permalink)  
Antiguo 18/04/2009, 12:12
Avatar de Calizman
Organiza competencias CSS
 
Fecha de Ingreso: octubre-2008
Ubicación: Ciudad de Guatemala, Guatemala
Mensajes: 1.122
Antigüedad: 15 años, 5 meses
Puntos: 83
Respuesta: Personalización de las cajas redondeadas

Mira, lamentablemente no entiendo mucho lo que quieres hacer, pero creo que si lo unico que quieres es cambiar un poco de texto, podrias usar el span, que (segun lo que se) es como una estiqueta a la que le puedes atribuir lo que quieras, ejemplo:

<div id="contenedor">
<p class="loquesea">bla bla bla bla bla<span>bla bla ba</span> bla bla bla</p>
</div>

El CSS seria asi:

#contenedor p {
color: red;
}

#contenedor p span {
color green;
}

Es eso lo que quieres? sino, talvez podrias explicarte un poquito mejor...
__________________
[ Mi Sitio Personal ]
"La felicidad no es una estacion de llegada... Es un modo de viajar"
Tom Schreiter
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 17:14.