Foros del Web » Creando para Internet » CSS »

Boton sin bordes.

Estas en el tema de Boton sin bordes. en el foro de CSS en Foros del Web. Esto es quizá una tontería, pero yo prefiero pensar que es más bien una curiosidad en cuanto al comportamiento de los navegadores. O por lo ...
  #1 (permalink)  
Antiguo 17/06/2009, 20:29
Avatar de buzu  
Fecha de Ingreso: octubre-2006
Ubicación: San Francisco, CA
Mensajes: 2.168
Antigüedad: 11 años, 1 mes
Puntos: 122
Boton sin bordes.

Esto es quizá una tontería, pero yo prefiero pensar que es más bien una curiosidad en cuanto al comportamiento de los navegadores. O por lo menos de los dos en los que he probado esto (FF y Safari).

Lo descubrí por accidente, pero al parecer si remueves el borde de los input, estos pierden su apariencia inicial. Yo esperaba que solo se les quitara el borde, pero no es así. Por ejemplo, los input tipo text, pierden ese fondo medio sombreado que tienen, pero lo más raro fueron los botones, Esa forma ovaladita con reflejos se vuelve un cuadro gris. Lo de los tipo texto no me impresiona, pero lo de los botones si me toma por sorpresa, sobre todo por que los tipo radio conservan su apariencia a pesar de ser muy similares. Puedes hacer lo siguiente para probar:

Código HTML:
Ver original
  1. <style type="text/css">
  2. *{
  3. border-width: 0px;
  4. }
  5.  
  6. <form name="input" action="" method="get">
  7. First name: <input type="text" name="FirstName" value="Mickey" size="20" /><br />
  8. Last name: <input type="text" name="LastName" value="Mouse" size="20" /><br />
  9. <input type="radio" />Radio<br />
  10. <input type="checkbox" />Radio<br />
  11. <br />
  12. <br />
  13. <input type="file" />Image<br />
  14. <br />
  15. <br />
  16.  
  17.   <option>Volvo</option>
  18.   <option>Saab</option>
  19.   <option>Mercedes</option>
  20.   <option>Audi</option>
  21. </select><br />
  22.  
  23. <input type="submit" value="Submit" />
  24. </form>
  25.  
  26. </body>
  27. </html>

Otro que sufre una transformación total es el select. Y todo por solo quitarles el borde.

Curioso no?
__________________
twitter: @imbuzu
  #2 (permalink)  
Antiguo 18/06/2009, 14:39
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: Boton sin bordes.

Hola:

La verdad, he hecho la prueba y es curioso. Lo lógico sería que desapareciera el borde pero solo eso. ¿Será útil en su momento?

El tiempo lo dirá.

Saludos.

  #3 (permalink)  
Antiguo 18/06/2009, 16:50
Avatar de buzu  
Fecha de Ingreso: octubre-2006
Ubicación: San Francisco, CA
Mensajes: 2.168
Antigüedad: 11 años, 1 mes
Puntos: 122
Respuesta: Boton sin bordes.

Si, si puede ser útil. Al menos a mi me parece que puede llegar a serlo....
__________________
twitter: @imbuzu
  #4 (permalink)  
Antiguo 18/06/2009, 17:09
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: Boton sin bordes.

Pues no lo entiendo: al menos en tu ejemplo, es que realmente lo único que elimina son bordes (inset, outset).
¿Qué otra cosa elimina que no sea un borde?
  #5 (permalink)  
Antiguo 18/06/2009, 17:47
Avatar de buzu  
Fecha de Ingreso: octubre-2006
Ubicación: San Francisco, CA
Mensajes: 2.168
Antigüedad: 11 años, 1 mes
Puntos: 122
Respuesta: Boton sin bordes.

viste los botones con FF? Los botones con FF en mac se ven como gelly buttons, pero al eliminar los bordes solo se mira un cuadro gris. Lo mismo pasa con el select. Pierde su color azul y se vuelve gris.
__________________
twitter: @imbuzu
  #6 (permalink)  
Antiguo 18/06/2009, 19:56
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.544
Antigüedad: 15 años, 8 meses
Puntos: 1262
Respuesta: Boton sin bordes.

Hola:

Me parece que también cambian el aspecto si se modifica el color de fondo ... y quién sabe que otros estilos puden alterar el aspecto.

Saludos
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
  #7 (permalink)  
Antiguo 18/06/2009, 20:05
Avatar de buzu  
Fecha de Ingreso: octubre-2006
Ubicación: San Francisco, CA
Mensajes: 2.168
Antigüedad: 11 años, 1 mes
Puntos: 122
Respuesta: Boton sin bordes.

Hummm... eso no había notado. Curioso sin duda.
__________________
twitter: @imbuzu
  #8 (permalink)  
Antiguo 18/06/2009, 20:55
Avatar de pato12  
Fecha de Ingreso: septiembre-2007
Ubicación: Salta
Mensajes: 1.620
Antigüedad: 10 años, 2 meses
Puntos: 101
Respuesta: Boton sin bordes.

Ahh, a que nadie noto esto :D
Tambien le quita el borde a la una barra de IE:

(http://halfmusic.com.ar/iecss.png)
__________________
Half Music - www.halfmusic.com
  #9 (permalink)  
Antiguo 18/06/2009, 23:12
Avatar de buzu  
Fecha de Ingreso: octubre-2006
Ubicación: San Francisco, CA
Mensajes: 2.168
Antigüedad: 11 años, 1 mes
Puntos: 122
Respuesta: Boton sin bordes.

creo que en realidad le está quitando el borde al formulario, si es que entendí bien a lo que te refieres
__________________
twitter: @imbuzu
  #10 (permalink)  
Antiguo 19/06/2009, 01:02
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: Boton sin bordes.

Cita:
Iniciado por buzu Ver Mensaje
Pierde su color azul y se vuelve gris.
¿Azul? Ah, debe ser que lo veo con FF2 y no hay nada azul. El botón es un cuadro gris con un borde outset negro, que le da relieve, y cuando lo quitas queda un simple cuadro gris, que es lo lógico.
Seguramente estabas hablando de la vista en FF3 o como dices FF MAC, que seguro que tiene otro aspecto y cambia como dices.

Pues no he dicho nada
(sólo que en FF2 no tiene misterio)
  #11 (permalink)  
Antiguo 19/06/2009, 01:30
Avatar de buzu  
Fecha de Ingreso: octubre-2006
Ubicación: San Francisco, CA
Mensajes: 2.168
Antigüedad: 11 años, 1 mes
Puntos: 122
Respuesta: Boton sin bordes.

Si, hablo de Mac.
Mira
normal:

sin borde:


EDITO: Acabo de checar FF2 y no hay misterio como bien lo menciona Mikmoro. Había olvidado que FF2 tiene todo al viejo estilo windows U_U
__________________
twitter: @imbuzu

Última edición por buzu; 19/06/2009 a las 01:39
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:22.