¿Cómo se crean estos tipos de botónes?

A

Awarez Seguir

Gamma
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
27 Jul 2009
Mensajes
199
Hola a todos,
Estuve comparando algunas opciones del vBulletin 3.8 con la 4.0...
Después de tiempo, observe un sitio de Web basado con el sistema vBulletin, tenia los botones como los que tiene vBHispano, o sea cuando le dan Clic por ejemplo se cambia de color...
Por si no me explico bien, acá tengo una pequeña imagen...
textbutton.png

La que está remarcar-cada indica que está el cursor apuntándole, ahora me pregunto ¿Cómo se hacen esos botones?
Investigando hace unos minutos, creo se le llaman Botones Estilo CSS. aún no tengo la menor idea...

Gracias.
 
O

Oswaldo Gutiérrez

Gamma
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
22 Dic 2009
Mensajes
190
De hecho debes saber trabajar con CSS, creas el botón con un div (en html) y a ese div le das estilo con css, para que el botón cambie cuando le colocas el mouse encima debes trabajar con la clase a de css (a:hover precisamente).

Seria algo así:

el html:

Insertar CODE, HTML o PHP: 
<div id="boton"><a href="http://www.lo_que_sea.com">Lo que sea</a></div>

el css:

Insertar CODE, HTML o PHP: 
#boton {
background-color: #000000;
width: 25px;
height: 15px;
}

#boton a {
color: #ffffff;
}

#boton a:hover {
color: #ff0000;
}

Por supuesto, esto es solo un ejemplo, pero te ilustro mas o menos como seria, en el identificador #boton debes decir el ancho y el alto que tendrá el div (para que puedas armar un botón), ademas de decirle el fondo (sea color, o imagen), luego en #boton a y #boton a:hover dices das estilo a la etiqueta html a (fijate que se usa dentro del div para colocar el link), este estilo permite decir que color tendrá el texto (puedes también cambiar el color de fondo usando background-color: color; ) cuando el mouse este o no sobre el.

Por allí puedes guiarte para lo que deseas hacer, espero te ayude en algo.
 
A

Awarez

Gamma
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
27 Jul 2009
Mensajes
199
Muchas gracias por tu información :D

---------- Actualizado a las 21:51 ---------- Original a las 18:18 ----------

Hola, Estuve investigando en sitios de vBulletin, y observe una manera igual a la tuya y me dice así,
add this code to additional CSS ur template
Ahora me pregunto, ¿Cuál es la opción adicional? Por qué me aparecen varias opciones para modificar...
 
S

superkefka

Beta
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
17 Mar 2009
Mensajes
111
Si no quieres hacer mucho código puedes hacerlo .gif y obtienes el mismo resultado, es super easy.

Saludos
 
O

Oswaldo Gutiérrez

Gamma
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
22 Dic 2009
Mensajes
190
Awarez dijo:
Muchas gracias por tu información :D

---------- Actualizado a las 21:51 ---------- Original a las 18:18 ----------

Hola, Estuve investigando en sitios de vBulletin, y observe una manera igual a la tuya y me dice así,
add this code to additional CSS ur template
Ahora me pregunto, ¿Cuál es la opción adicional? Por qué me aparecen varias opciones para modificar...
Hacer clic para expandir...

Pero cual código te pide agregar??
 
C

Cmsqvl

Gamma
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
18 Abr 2009
Mensajes
186
Me imagino que en la guía le dan un código y le dicen que "add this code to additional CSS ur template" osea que añada ese código que le están dando a la plantilla additional.css de su estilo nada mas :) pues eso es lo que quiere decir ahí.

Osea Awarez estas confundiendo "opción adicional" con "additional CSS" que es una plantilla de los estilos de vBulletin.-
 
Hay que estar conectado o registrado para responder aquí.
Arriba