Ver la Versión Completa : boton con aspecto de link
halizia
19-04-2007, 18:25:04
hola a todos!
estoy tratando de hacer un botón pero que tenga aspecto de link, se hace con un css pero, no m funciona :s Me puede ayudar alguien?
Saludos y gracias.
Hola,
No sé si te refieres a algo más o menos como esto:
<style type="text/css">
.btnlink {
color: blue;
border: none;
cursor: pointer;
background-color: #fff;
text-decoration: underline;
}
.btnlink:hover {
color: red;
background-color: #fff;
}
</style>
<form>
<div>
<input class="btnlink" type="button" value="Clic aquí" />
</div>
</form>
Una variante (más general) podría ser esta, usando un selector CSS en lugar de una clase:
<style type="text/css">
input[type=button] {
color: blue;
border: none;
cursor: pointer;
background-color: #fff;
text-decoration: underline;
}
input[type=button]:hover {
color: red;
background-color: #fff;
}
</style>
<form action="" method="post">
<div>
<input type="button" value="Clic aquí" />
</div>
</form>
Eso se suele hacer con javascript, no con css, porque segun el navegador, varia la apariencia final, y hay algunas propiedades a las que algunos navegadores no hacen caso si se aplican a botones. En concreto el explorer se pasará por el forro la propiedad hover de un boton, ya que solo hace caso a los :hover de los links.
<form name="miformulario">
<a href="javascript:document.miformulario.submit();">Submit</a>
</form>
Hola,
A ver... que yo sepa no se puede (con CSS) convertir un enlace en un botón... hasta donde yo llego, ya digo. Por otro lado yo no pensaba en mi respuesta que se refería a que un enlace actuara como un botón, sino que entendí que lo que se quería era que un botón tuviera apariencia de enlace.
Dicho esto, la segunda variante del código que he puesto más arriba (el que hace uso de selectores CSS) no funciona en Internet Explorer 7, es cierto, aunque funciona en Opera y Firefox sin problemas. Pero, el primer código, es decir, el que hace uso de una clase CSS funciona en Internet Explorer 7, Opera y Firefox.
He dicho. :D :D
halizia
19-04-2007, 18:58:06
Yo solo quería el aspecto y con <style> de dec ha salido lo que quería.
Muchas gracias!!
roman
19-04-2007, 21:57:55
la segunda variante del código que he puesto más arriba (el que hace uso de selectores CSS) no funciona en Internet Explorer 7
A mi me funciona perfecto en Firefox 2 e Internet Explorer 7, con todo y hover. Gracias por lo de los selectores, no lo conocía.
// Saludos
Hola,
A mi me funciona perfecto en Firefox 2 e Internet Explorer 7, con todo y hover. Gracias por lo de los selectores, no lo conocía.
Pues chico, cuando lo probé no iba bien... :)
Respecto de los selectores CSS... yo es algo en lo que estoy pez, pero, me consta que se pueden hacer maravillas con ellos... :D
roman
19-04-2007, 22:23:37
¡Ah pues...! ¿No es así como debe verse?
http://img236.imageshack.us/img236/3166/botonespq9.png (http://imageshack.us)
// Saludos
Hola,
Pues chico, yo acabo de probarlo y...
http://img267.imageshack.us/img267/6205/pruebaeh1.jpg (http://imageshack.us)
http://img374.imageshack.us/img374/663/acercadesm4.jpg (http://imageshack.us)
roman
19-04-2007, 22:47:51
Pues sí que es raro:
http://img231.imageshack.us/img231/4549/botones2we8.png (http://imageshack.us)
Por cierto, ¿conocen algún equivalente a imageshack que sea más rápido?
// Saludos
roman
19-04-2007, 22:53:55
¡Ah! Ya ví, no es nada raro, es sólo que tú no tienes un DOCTYPE.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
// Saludos
Hola,
Sí; la verdad es que imaginaba algo así. De hecho agregé al código el "HTML", "HEAD", "BODY"... por ver si así se arreglaba, pero, ya sabemos lo hacía falta. :)
El principal problema de usar CSS para eso es que un porcentaje bastante grande de usuarios todavia usan explorer 6 , y aun quedan algunos con explorer 5 (.
roman
20-04-2007, 17:58:41
Eso es cierto, y, de hecho, yo no entiendo porqué se quiere cambiar así el aspecto de un botón en lugar de utilizar un enlace normal para hacer le submit.
// Saludos
Hola,
Bueno... pero no estás dejando fuera a ningún usuario, puesto que sólo estás cambiando el estilo del botón: si un cliente no puede "pintar" el botón con ese estilo, vale, pero, no dejará de poder pintar un "botón normal" y santas pascuas.
Otras cosas hay peores... en el sentido de que pueden no funcionar "del todo" en ciertos clientes/navegadores. Pero el tema del estilo es algo distinto: no estás afectando a la "lógica" de la aplicación.
O sea, que no estás dejando fuera a ningún usuario en este caso. Únicamente que un usuario con Internet Explorer 5, por ejemplo, verá un botón y no un enlace, pero nada más: el botón funcionará en todo caso.
roman
20-04-2007, 18:48:51
También eso es cierto, pero todo depende de hasta qué punto la funcionalidad de tu sitio dependa del CSS. Sí, ya sé que un sólo botón puede no ser un gran problema, pero en el overall de las cosas puede afectar. Deshabilita los estilos de esta misma página que estás leyendo y dime tú que tanto puedes hacer sin ellos :p
Claro, el punto es, no bases el funcionamiento en la apariencia, pero eso no siempre lo tenemos muy claro.
// Saludos
semptrion
22-04-2007, 05:06:30
No es por nada, pero observo una gran dependencia del resultado de vuestros contenidos hacia el IE. Valdría la pena dar una ojeada a este documento:
http://www.discapnet.es/web_accesible/tecnicas/WCAG10-TECHS-20001106_es.html
y luego quiza a éstos:
http://www.w3.org/2005/11/Translations/Lists/OverviewLang.html#es
Y por favor, dejen de programar como Window-ceros.
No es por nada, pero observo una gran dependencia del resultado de vuestros contenidos hacia el IE. Valdría la pena dar una ojeada a este documento:
http://www.discapnet.es/web_accesible/tecnicas/WCAG10-TECHS-20001106_es.html
y luego quiza a éstos:
http://www.w3.org/2005/11/Translations/Lists/OverviewLang.html#es
Y por favor, dejen de programar como Window-ceros.
:rolleyes: :eek: :confused: ;)
roman
22-04-2007, 07:12:51
Thanks for living
:rolleyes: :cool: :eek: :p ;) :D
No es por nada, pero observo una gran dependencia del resultado de vuestros contenidos hacia el IE. Valdría la pena dar una ojeada a este documento:
http://www.discapnet.es/web_accesible/tecnicas/WCAG10-TECHS-20001106_es.html
y luego quiza a éstos:
http://www.w3.org/2005/11/Translations/Lists/OverviewLang.html#es
Y por favor, dejen de programar como Window-ceros.
En la vida real, el 90% de la gente usa explorer, asi que las paginas que uno haga a narices tiene que salir bien en explorer. Y esto no tienen nada que ver con que uno use o no use windows o el explorer, tiene que ver con el 90% de los usuarios y de los clientes para los que uno hace su trabajo y que lo pagan usan explorer.
En concreto yo diseño incialmente usando Mozilla Firefox, entre otras cosas porque trae plugins como el Web developer y otras herramientas, que facilitan muchisimo el trabajo, y despues ajusto el css y los diseños, utilizando si es necesario los tipicos hacks existentes para explorer, para que salgan aceptablemente, tanto en explorer, como en konqueror como en Opera. Y en la mayoria de los casos solo es necesario hacer ajustes o usar hacks para explorer, unas paginas y css diseñados mas o menos correctamente, suelen verse igual de bien en firefox, opera y konqueror.
Ya me gustaria a mi que el explorer, especialmente la version 6 (y de la version 5 ya ni hablar porque esta si que es un cachondeo absoluto), renderizara correctamente las paginas segun las especificaciones, se ahorraria bastante trabajo ( renderizado incorrecto de los divs flotantes, bug de los margenes con divs flotantes, calculo incorrecto de las posiciones de los divs cuando se usa posicionamiento absoluto, falta de semitransparecias en los pngs, bugs de renderizado de fondos con posicionamientos relativos o cuando la pagina es medianamente compleja, etc,etc,etc ... )
En definitiva aqui nadie ha hablado de hacer paginas "solo" para explorer sino que simplemente deben verse correctamente tambien en este navegador.
Un Saludo
semptrion
23-04-2007, 16:43:36
La invitación a revisar el documento de accesibilidad era para resolver el tema de "un botón que parezca link" (!?), que sería interesante saber como es representado en un medio aureal o braile o, sin ir muy lejos, en impresora. Es decir, no todos los que vean verán en un IE (o firefox si es lo que usas).
En cuanto al comentario, parte de una premisa que es equivocada.
[quote=Mick]En la vida real, el 90% de la gente usa explorer, asi que las paginas que uno haga a narices tiene que salir bien en explorer.[quote]
Prefiero que esa aseveración la responda w3, para lo que te invito a que revises
http://www.w3schools.com/browsers/browsers_stats.asp
Quizá ya no estemos tan tentados a afirmar del 90% o del 80% ya que el IE (en todas sus variaciones) no alcanza al 50%. Y es precisamente porque la gente está cambiando el timón de sus preferencias debido a los problemas en presentación y procesamiento que presenta el IE.
[quote=Mick]tiene que ver con el 90% de los usuarios y de los clientes para los que uno hace su trabajo y que lo pagan usan explorer.[quote]
La responsabilidad con los clientes es fundamental. Se cumple esa responsabilidad produciendo código lleno de hacks?
[quote=Mick]En definitiva aqui nadie ha hablado de hacer paginas "solo" para explorer sino que simplemente deben verse correctamente tambien en este navegador.[quote]
Nada es definitivo. Y las páginas deben verse correctamente en todos los clientes, sean estos navegadores, impresoras, braile o aureal o robots.
Insisto en que se deberían revisar las guías de accesibilidad para encontrar mejores soluciones que las de volver un "botón en link" e insisto en que debemos dejar de programar como Windowceros, es decir, sin doctrina ni fundamentos, improvisando hasta llegar a un equilibrio tan frágil como es "que funcione y listo".
Debo volver al trabajo, pero continuaré con esto...
roman
23-04-2007, 19:50:39
Prefiero que esa aseveración la responda w3, para lo que te invito a que revises
http://www.w3schools.com/browsers/browsers_stats.asp
Quizá ya no estemos tan tentados a afirmar del 90% o del 80% ya que el IE (en todas sus variaciones) no alcanza al 50%.
+-------+-------+------+-------+------+------+------+
| IE7 | IE6 | IE5 | Fx | Moz | S | O |
+-------+-------+------+-------+------+------+------+
| 18.0% | 38.7% | 2.0% | 31.8% | 1.3% | 1.7% | 1.6% |
+-------+-------+------+-------+------+------+------+
18 + 38.7 + 2 = 58.7 > 50
Pero más interesante, es que w3schools responde más adelante
W3Schools is a website for people with an interest for web technologies. These people are more interested in using alternative browsers than the average user. The average user tends to use Internet Explorer, since it comes preinstalled with Windows. Most do not seek out other browsers.
These facts indicate that the browser figures above are not 100% realistic. Other web sites have statistics showing that Internet Explorer is used by at least 80% of the users.
Y por cierto,
Insisto en que se deberían revisar las guías de accesibilidad para encontrar mejores soluciones que las de volver un "botón en link" e insisto en que debemos dejar de programar como Windowceros, es decir, sin doctrina ni fundamentos, improvisando hasta llegar a un equilibrio tan frágil como es "que funcione y listo".
¿Cuáles, exactamente, son tus bases para hacer tal afirmación?
// Saludos
semptrion
23-04-2007, 23:29:25
Román
Me gustaría responder a las varias interpretaciones que haces una a una para no sembrar confusión:
1) 18 + 38.7 + 2 = 58.7 > 50
Tienes TODA LA RAZÓN... debo corregir que no alcanza al 60%
2) En búsqueda de mayor imparcialidad, en la transcripción debiste transcribir la siguiente línea que dice:
"Anyway, our data, collected over a five year period, clearly shows the long and medium-term trends."
Y más importante, analizar la evolución de la preferencia de uso que, podemos resumirla en lo siguiente (si es que no sumo mal otra vez :-)):
Marzo 2003 88.00%
Marzo 2004 82.80%
Marzo 2005 72.50%
Marzo 2006 64.70%
Marzo 2007 58.70%
Y la evolución es elocuente.
3) en cuanto a la afirmación respecto a que dejen de programar como windowceros tiene fundamento en este mismo hilo, en los mensajes precedentes y "el azar" de los resultados.
roman
23-04-2007, 23:40:08
¿Debí transcribir? No hay problema. Pero el punto es que aquí nadie ha hablado de la tendencia y difícilmente podría alguien negar que haya cada vez más usuarios de otros navegadores. De lo que se habló aquí fue de la realidad hoy, (no mañana, o cuando la tendencia ponga a FF en primer lugar), y esa es la parte que tú decidiste no transcribir.
Ahora bien, deducir de un simple hilo- donde además ni siquiera decimos lo que tú interpretas que decimos -acerca de nuestra falta de doctrina y fundamentos para programar, tan sólo muestra lo rápido que eres para emitir conclusiones y la seriedad de tus argumentos.
// Saludos
semptrion
24-04-2007, 02:42:57
Román:
Debo colegir de tus palabras que lo que haces es "programar para hoy y no para mañana"?.
Suena a software doméstico eso. (Claro que hay empresas y empresas que contratan programadores web y algunas de esas empresas les interesa lo que sucede hoy y no lo que sucederá mañana. Pero prefiero hablar de esas empresas que si les interesa alcanzar a todo el público, que contratan profesionales que les provean del mejor software que puedan proveer y que sirva para algo más de unos meses o incluso para algo más de unos años.)
Quisiera sin embargo saber que el software es más profesional y tiene más experiencia que la indicidual. Pero, pedir eso es demasiado. Te entiendo. Y entiendo que empieces a ser más agresivo en tus conceptos hacia mí o hacia cualquiera que inisiste en mejorar y avanzar. No me hago problema con eso.
No te agredo ni a nadie del hilo o del foro, al decir no hagamos esto o aquello, ya que los que no lo hacen, reforzarán ese concepto, lo mejorarán, lo enriquecerán; los otros, armarán paredes más gruesas. Suerte para ellos en su práctica y en su vida.
Mientras tanto, no esperes que me quede callado en este o en otro tema donde pueda ayudar, recomendar, o ser ayudado y recomendado. Para eso participamos y tomamos nuestro tiempo.
Si como moderador del foro no te interesa mi participación y por ello, tan libre de cuerpo, me calificas de poco serio o de ofensor, pues nada más de que hablar. En tu caso, como moderador que eres, sólo me queda sugerirte que te moderes en tus conceptos.
En mi caso -sin apartarme del hilo- sostendré mi posición de que, para desarrollar web no sólo son suficientes los resultados sino los medios y los fundamentos para hacerlo. Que si existe una experiencia y un estándar en el que nos debemos apoyar, nos apoyemos, y que ése está en la W3C. Que el estándar nos indica que existe algo más que el IE y que debemos considerar ese algo más.
Y, finalmente, que la experiencia nos muestra que cuando los programadores se salen del estándar, el perjuicio es para todos, porque impiden el avance de la tecnología, un avance que puede redundar en conceptos y actividades más sencillas y más al alcance de todos. Pero Ups! me volví a meter con el futuro... y eso es algo que a tí no te interesa.
roman
24-04-2007, 02:48:06
Lo dicho. Concluyes demasiadas cosas a partir de muy pocos o ningún elemento.
Suerte.
// Saludos
semptrion
24-04-2007, 02:55:54
Ok. Big mistake.
Respecto del hilo, cual es tu opinión?
Tiene que ver con el 90% de los usuarios y de los clientes para los que uno hace su trabajo y que lo pagan usan explorer.
La responsabilidad con los clientes es fundamental. Se cumple esa responsabilidad produciendo código lleno de hacks?
Podemos estar de acuerdo que lo ideal es no usar hacks, pero señor mio en la vida real o haces eso o diseñas para explorer olvidandote del resto de navegadores, y hasta las compañias y projectos mas grandes relacionados con la web usan hacks para explorer, incluso aquellos que abogan por el uso de estandares.
Puedes mirar por ejemplo cualquiera de los gestores de contenidos con licencia libre, y veras que practicamente todos usan hacks para reparar problemas con el explorer.
Tu posicion es loable, pero no es realista, una pagina web diseñada correctamente no necesariamente funciona bien en explorer, luego solo hay las siguientes opciones:
- Diseñas la pagina de otra forma siguiendo igualmente los estandares, a costa en ocasiones de perder funcionalidad, esto siguen siendo hacks, una pagina correcta no tendria porque ser necesario rediseñarla de otra forma.
- Pones en la pagina de entrada un link para que se descarguen otro navegador que cumpla mejor los estandares, muy loable, pero quiero comer todos los meses, y con esto no tendria ni 4 clientes.
- Utilizar hacks para el explorer, se vera bien en todos los navegadores actuales, esta es la unica solucion practica.
Saludos
semptrion
25-04-2007, 19:51:10
Mick.
Respondo tu comentario con el menor ánimo ya que nuevamente puedo ser objeto de burla por parte del moderador. Y aunque me había hecho el propósito de ya no participar en este foro, creo que tus inteligentes aseveraciones deben ser mejor estudiadas y atendidas.
Por una parte, realizar hacks para hacer que una página web funcione en IE o en Mozilla normalmente responde al hecho tanto que el cliente como el programador no entienden sobre accesibilidad y tampoco buscan cumplir el estándar. Y aún si el programador entiende sobre accesibilidad, no es función del programador incumplir el estándar para atender a esa empresa.
Un Ingeniero Civil hará todo lo posible por construir un edificio seguro, por mucho que su cliente le exponga realidades y criterios estéticos o funcionales. En el caso de la programación sobre la web, no hay mucha diferencia en cuanto a la responsabilidad. Si es necesario, se deberá recortar la prestación para hacerla funcionar de forma accesible.
Vale decir, es como cuando aparecía el mensaje de "El programa ha realizado una operación ilegal y ..." y el usuario perdía su documento; la tendencia de los usuarios en esos casos es echarse la culpa y decirse algo así como "bruto! sabiendo que es un documento importante, porqué no grabas cada minuto!!"
El problema no es del usuario, es de la empresa. Quien debe resolver la falta de estandarización no es el usuario, es la empresa. Mientras tanto, no obliguemos a que nuestros usuarios paguen por su preferencia por uno u otro browser. Existen aún muchos otros usuarios que merecen ser atendidos. Estamos en la era post-PC. Porqué seguir adaptando el código para que funcione únicamente en una PC? más aún, porqué adaptar nuestro código para que funcione en un browser específico?
Esa falta de entendimiento es una barrera para la accesibilidad. Mucha gente ve el uso de su página o de su sitio pero no ve la accesibilidad. Esa en verdad es la realidad. No lo que los usuarios usan como browser, sino lo que es la Internet.
Me permito citar a Luis Villa (http://www.alzado.org/articulo.php?id_art=456) cuando dice, "sin accesibilidad no existiría la www sino redes y sistemas inconexos marcados por perfiles de usuarios y plataformas."
Pero eso también significa una mayor profundización en los conocimientos acerca de las tecnologías web. Cuando tendemos a convertirnos en "todólogos" que conocemos de todo la superficie, entonces estamos en tinieblas cuando se trata de trabajo profesional y sobre los fundamentos de hacer tal o cual cosa.
Ya ves que, por ejemplo, que un programador para web no conozca lo que son los selectores del css o que no conozca la diferencia entre html y xhtml o que no conozca la diferencia entre sgml y html, sin ir muy lejos, está mu lejos de hacer un trabajo profesional.
Quizá haga un trabajo "bonito", quizá hasta sea funcional. Pero hay más detrás de todo eso.
Mantener una página con hacks es un infierno. Ningún programador profesional se animaría a programar lo que en el tiempo costará más mantener.
Es como pedir a un mecánico que compre un auto con "arreglos". Él más que nadie sabe que eso, en el tiempo, será una tortura y que requerirá más esfuerzo y más dinero.
Finalmente, aclarar que el seguimiento estricto de estándares no garantiza accesibilidad. Así como que la accesibilidad no está garantizada por las herramientas que validan accesibilidad.
La accesibilidad es un tema de los desarroladores, pero *por* y *para* los usuarios.
He encontrado información valiosa de accesibilidad en http://www.sidar.org/recur/desdi/docs/index.php
(Aparte del mismo tema de la accesibilidad, existen otros documentos interesantes como por ejemplo, cómo hacer accesible un sitio utilizando Dreamweaver o (incluso!) Frontpage para los que trabajan sobre windows.)
Como verás, sigue siendo un problema de fundamentos. Y aunque querramos trasladarlo a otros ámbitos, seguirá siendo un problema de fundamentos.
Te propongo una cuarta opción: entender las razonas por las que se recomienda accesibilidad y actuar en función de ello.
Y existen otras opciones más...
Un saludo sincero y un fuerte abrazo
vBulletin v3.6.8, Derechos ©2000-2024, Jelsoft Enterprises Ltd.