Foros Club Delphi - boton con aspecto de link

Foros Club Delphi (https://www.clubdelphi.com/foros/index.php)

- HTML, Javascript y otros (https://www.clubdelphi.com/foros/forumdisplay.php?f=38)

- - boton con aspecto de link (https://www.clubdelphi.com/foros/showthread.php?t=42680)

boton con aspecto de link

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:

Código PHP:


		
			
<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:

Código PHP:


		
			
<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.

Código:

<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

Yo solo quería el aspecto y con <style> de dec ha salido lo que quería.
Muchas gracias!!

Cita:

Empezado por dec

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,

Cita:

Empezado por Román

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

¡Ah pues...! ¿No es así como debe verse?

// Saludos

Hola,

Pues chico, yo acabo de probarlo y...

Pues sí que es raro:

Por cierto, ¿conocen algún equivalente a imageshack que sea más rápido?

// Saludos

¡Ah! Ya ví, no es nada raro, es sólo que tú no tienes un DOCTYPE.

Código:

<!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 (.

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.

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

Botones que se vuelven enlaces y programadores que (por el IE) se vuelven monos

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_accesibl...001106_es.html

y luego quiza a éstos:

http://www.w3.org/2005/11/Translatio...ewLang.html#es

Y por favor, dejen de programar como Window-ceros.

Cita:

Empezado por semptrion

:rolleyes: :eek: :confused: ;)

Thanks for living

:rolleyes: :cool: :eek: :p ;) :D

Cita:

Empezado por semptrion

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