Foros del Web » Creando para Internet » CSS »

modificar hr en CSS

Estas en el tema de modificar hr en CSS en el foro de CSS en Foros del Web. Bueno la pregunta es sencilla, necesito modificar hr mediante las hojas de estilo. A ver, el color no me da problemas hr {color:#000;} pero queria ...
  #1 (permalink)  
Antiguo 05/07/2005, 11:41
Avatar de xevisoyyo  
Fecha de Ingreso: mayo-2005
Mensajes: 166
Antigüedad: 12 años, 7 meses
Puntos: 1
modificar hr en CSS

Bueno la pregunta es sencilla, necesito modificar hr mediante las hojas de estilo. A ver, el color no me da problemas hr {color:#000;} pero queria cambiar tmb el grosor, en html seria asi <hr size='1'> y mi pregunta es ¿como lo hago en la hoja de estilo? he probado hr {color:#000;size:1;} que creia q era asi, tmb he probado poniendo size:1px por si las moscas, pero nada

ademas: pongo los margenes y paddings a 0 de toda la hoja
*{padding:0;margin:0;}
para que los diferentes navegdores interpreten por igual, y probe de poner border 0 y paso algo en el opera que no en internet explorer, desaparecieron todos los hr, asi q probe si cambiando el borde hr {color:#000;border:1;} y nada, asi que si alguien sabe como hacerlo, porq realmente tengo millones de hr repartidas por la web y seria muy util poder modificarlas asi, y bueno si hay mas modificaciones del hr y las quereis poner podrian ser utiles para todos, gracias
  #2 (permalink)  
Antiguo 05/07/2005, 12:39
Avatar de KnowDemon  
Fecha de Ingreso: julio-2004
Ubicación: Ciudad de México
Mensajes: 544
Antigüedad: 13 años, 5 meses
Puntos: 2
Hola,

Aunque no suelo usar las hr, deben estar sujetas a las mismas reglas de estilo que todos los demas elementos. No existe la regla size, pero si height y width.

Para definir tamaños siempre debes especificar la unidad en la que se encuentran, sean pixeles, porcentajes, puntos, etc. No existe algo como la unidad por defecto. El único caso en que puedes no especificar la unidad es para tamaños 0 (cero).

Asi tal cual la regla border "condensa" las reglas para todos los bordes y sus popiedades, deberías usarlo:

border: [grosor] [estilo] [color];

Ejemplo:

border: 2px solid #fc9;

Te recomiendo leer un manual de CSS, por decir algo:
http://www.sidar.org/recur/desdi/mcss/index.php
__________________
Mi pequeño espacio en la web: VisiónE
"El cosmos es todo lo que es, todo lo que fue, y todo lo que será alguna vez."
  #3 (permalink)  
Antiguo 05/07/2005, 12:42
Avatar de Daniel Ulczyk
Moderador
 
Fecha de Ingreso: febrero-2005
Ubicación: Buenos Aires
Mensajes: 9.175
Antigüedad: 12 años, 9 meses
Puntos: 2072
La correcta definición de tu hr, sería de la siguiente manera:

hr {
color: #000000;
font-size: 10px;
}

Las unidades (según CSS2) potenciales para font-size, son:
ex
em
px
cm
mm
pc
in
pt

Saludos
__________________
—Somos lo que hacemos repetidamente. La excelencia, entonces, no es un acto sino un hábito. (Aristóteles dixit)
  #4 (permalink)  
Antiguo 05/07/2005, 14:34
Avatar de Durgeoble  
Fecha de Ingreso: marzo-2003
Mensajes: 462
Antigüedad: 14 años, 8 meses
Puntos: 2
http://www.sidar.org/recur/desdi/tra...s/syndata.html aqui lo tienes mas explicado
__________________
Todas mis respuestas funcionaran correctamente en aquellos navegadores que respeten los estandares.
  #5 (permalink)  
Antiguo 05/07/2005, 17:09
Avatar de xevisoyyo  
Fecha de Ingreso: mayo-2005
Mensajes: 166
Antigüedad: 12 años, 7 meses
Puntos: 1
gracias a todos, ahora no tengo tiempo me guardo las respuestas y me lo mirare y os dire algo, gracias, a todos
  #6 (permalink)  
Antiguo 06/07/2005, 12:20
Avatar de xevisoyyo  
Fecha de Ingreso: mayo-2005
Mensajes: 166
Antigüedad: 12 años, 7 meses
Puntos: 1
hr en todos los navegadores por = con CSS

Bueno ya me lo he mirado mejor y para ver hr en un pixel de grosor (fina) hay que poner hr{color:#0000FF;height:1px;} pero solo sirve para internet explorer ya que en opera e imagino que en los demas sale normal y sin color. Si alguien sabe algo tan sencillo (deberia) como un hr fino y de color en todos los navegadores (incluido ie) se lo agradeceria. Seguire buscando.

PD: gracias porque me interesaba mas internet explorer, pero me fastidia que interprete diferente a los demas, asi que a ver si alguien sabe como hacer esta tonteria... gracias
  #7 (permalink)  
Antiguo 07/07/2005, 01:10
Avatar de KnowDemon  
Fecha de Ingreso: julio-2004
Ubicación: Ciudad de México
Mensajes: 544
Antigüedad: 13 años, 5 meses
Puntos: 2
Hola,

No tengo oportunidad de ver el resultado con explorer... pero:

color solo debe afectar el color del texto, así que no tiene mucho caso usarlo así, aunque Explorer (que le encanta hacer las cosas algo raro), le de color a tu barra con él.

Para lo que deseas solo es necesario definir el borde de tu hr, con las instrucciones adecuadas la puedes hacer parecer plana, levantada o en depresión. Todo especificando el tipo de borde que deseas. Puede ser:

hidden
dotted
dashed
solid
double
groove
ridge
inset
outset


Ejemplo:

border: 3px inset blue;
__________________
Mi pequeño espacio en la web: VisiónE
"El cosmos es todo lo que es, todo lo que fue, y todo lo que será alguna vez."
  #8 (permalink)  
Antiguo 07/07/2005, 15:00
Avatar de xevisoyyo  
Fecha de Ingreso: mayo-2005
Mensajes: 166
Antigüedad: 12 años, 7 meses
Puntos: 1
hr{border: 1px solid #0000FF;}

asi lo tuve que poner, es la unica manera en que en ambos navegadores (opera, etc y explorer) pintan la barra hr de azul, en cuando al ancho, no hay manera, si pongo height 1px va bien en explorer, pero no en opera si pogo border 1px va en los dos, pero no queda fina (<hr size="1">) bueno lo dejare asi, aunq queden mas gruesas, pero si en explorer se puede porq en los demas no?, no hay manera de ver la barrita fina, pero da = porq seguro cuando lo consiga no se vera en explrer o falara el color y bueno aunq explorer se salga de lo normal, es el mas usado, asi q bueno, me rindo jaja, lo dejo asi q no viene de un px, ya era por vicio jaja,... gracias por todo
  #9 (permalink)  
Antiguo 07/07/2005, 15:12
Avatar de Durgeoble  
Fecha de Ingreso: marzo-2003
Mensajes: 462
Antigüedad: 14 años, 8 meses
Puntos: 2
hr {
background-color: Blue;
height: 1px;
border: 0;
color: blue;
}
Funciona en todos (el color es pa IE que para variar hace lo que le da la real ganaXD)
__________________
Todas mis respuestas funcionaran correctamente en aquellos navegadores que respeten los estandares.
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 04:29.