Diseño de páginas webs, imagen corporativa, posicionamiento en google
  • Inicio

    Bienvenidos
  • Servicios

    Qué ofrecemos
    • Diseño de páginas webs

    • Imagen e identidad corporativa

    • Posicionamiento en Buscadores

    • Tu empresa en Redes Sociales

    • Mantenimiento y configuración de WordPress

    • Mantenimiento y configuración de Joomla

    • Sitio web para concesionarios de autos

  • Portfolio

    Trabajos
  • Sessionstudio

    Nosotros | Clientes
    • Empresa

    • Clientes

  • Blog

    Novedades
  • Contacto

    Contáctese
HomeNoticiasBotones con CSS3

Botones con CSS3

septiembre 23, 2010
por sessionstudio

TagsBotones, Botones Con CSS3, CSS, CSS3, HTML, Noticias
Agregar Comentario.
Email
Botones con CSS3

Como crear botones con CSS3
Uno de los mejores implementos que podemos encontrar en CSS3 es el agregado de colores RGBA.


Esto nos permite aplicar degradados a nuestros botones, con solamente código CSS
Crear estos botones es muy sencillo, en este ejemplo los botones, además de ser estéticos, son escalables!

[html]
<title>Botones con CSS3</title>
<style type="text/css">
.boton, .boton:visited {
background: #222 url(alert-overlay.png) repeat-x;
display: inline-block;
padding: 5px 5px 6px;
color: #fff;
text-decoration: none;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
border-bottom: 1px solid rgba(0,0,0,0.25);
position: relative;
cursor: pointer;
}

.boton:hover                            { background-color: #111; color: #fff; }
.boton:active                            { top: 1px; }
.boton, .boton:visited,
.large.boton, .large.boton:visited             { font-size: 20px; padding: 5px; }
.blue.boton, .blue.boton:visited        { background-color: #2daebf; }
.blue.boton:hover                            { background-color: #007d9a; }

</style>
[/html]

Ejemplo de Botones con CSS3

Otros Artículos

« Anterior
Formatear CSS Online
Siguiente »
Cambiar tamaño de texto con Javascript y CSS

Cancel Reply

Comentar





Servicios

  • Diseño de páginas webs
  • Imagen e identidad corporativa
  • Posicionamiento en Buscadores
  • Tu empresa en Redes Sociales
  • Mantenimiento y configuración de WordPress
  • Mantenimiento y configuración de Joomla
  • Sitio web para concesionarios de autos

Seguinos en Google +


Seguinos en Facebook


Entradas Populares

  • Mostrar Tweets con PHP
  • Sliderman: Slide de imágenes en Javascript
  • Expandir y Colapsar DIV con Jquery
  • Barras laterales personalizadas en wordpress
  • Mover la barra admin de WordPress hacia abajo

Nube de Etiquetas

Acciones Photoshop acortador url Adobe BlindElephant Botones Botones Con CSS3 CSS CSS3 descarga Diseño de Logos Diseño de Newsletter Diseño Web Fondo Twitter Fotografía Fuentes fuentes gratis gratis gráficas Hacks Wordpress HTML Iconos iconos gratis imagen corporativa Imágenes Gratis Jquery Noticias Photoshop php Pinceles Plantilla PSD Twitter Portfolio Recursos Scripts Seguridad Slide Jquery Software Texturas Tipografias Tutoriales tweets twitter Wordpress Wordpress 3.0 wordpress 3.1 Wordpress plugins

Nuestros Servicios

  • Diseño de páginas webs
  • Imagen e identidad corporativa
  • Posicionamiento en Buscadores
  • Tu empresa en Redes Sociales
  • Mantenimiento y configuración de WordPress
  • Mantenimiento y configuración de Joomla
  • Sitio web para concesionarios de autos

Entradas Populares

  • Texturas y Fondos Vintage
  • Texturas y fondos de lunares
  • Patterns o motivos vintages
  • Subir archivos con JQuery
  • Slide con Jquery – dualslider
  • Blog
  • Fondos para nuevo Twitter según la resolución
  • Fuente de Papel

Contáctenos

Seguinos

Últimos Tweets

  • Twitter feed loading
Sessionstudio | Copyright © 2004-2012 | Miembros del Miembros del Polo Tecnológico Rosario
Llámenos : + 54 341 3133 538 | Feeds