/* -[INICIO devildrey33.Boton1]- */ /* Estilo para el botón */ .Boton1 { /* Propieades para la visualización */ display:table; padding:3px; margin:3px; /* Porpiedades para el borde */ border-color:rgb(50, 50, 50); border-style:solid; border-width:1px; border-radius:4px; /* Propiedades para el fondo */ background-color:rgb(0, 200, 0); /* Sombra para el botón */ box-shadow: rgba(128,128,128, 0.5) 2px 2px 2px; } /* Estilo para el botón cuando el mouse se encuentra encima */ .Boton1:hover { /* Propiedades para el fondo */ background-color:rgb(0, 220, 0); /* Cursor del mouse */ cursor:pointer; } /* Estilos para los enlaces dentro del botón */ .Boton1 a { text-decoration:none; color:rgb(255, 255, 255); } /* Estilos para los enlaces resaltados dentro del botón */ .Boton1 a:hover { text-decoration:none; color:rgb(255, 255, 0); } /* -[FIN devildrey33.Boton1]- */ /* -[INICIO devildrey33.Boton2]- */ /* Estilo para el botón de los garabatos */ .Boton2 { /* Propieades para la visualización */ position:relative; display:table; padding:3px; margin:3px; width:100px; /* Propiedades para el fondo */ background-image:url('Tutorial_HTML5_7_Ejemplo_Garabatos.png'); background-repeat:no-repeat; /* Propiedades para el texto */ text-align:center; text-shadow:1px 1px 1px rgb(0, 0, 0); } /* Estilo para el botón de los garabatos RESALTADO */ .Boton2:hover { /* Propiedades para el fondo */ background-position:-100px 0px; /* Cursor del mouse */ cursor:pointer; } /* Estilos para los enlaces dentro del botón */ .Boton2 a { color:rgb(255, 255, 255); text-decoration:none; } /* Estilos para los enlaces resaltados dentro del botón */ .Boton2:hover a { color:rgb(255, 0, 0); text-decoration:none; } /* -[FIN devildrey33.Boton2]- */ /* -[INICIO devildrey33.Boton3]- */ /* Botón 3 */ .Boton3 { display:table; } .Boton3:hover { cursor:pointer; } /* Enlaces dentro del botón 3*/ .Boton3 a { color:rgb(50, 50, 50); text-decoration:none; } .Boton3:hover a { color:rgb(0, 0, 0); text-decoration:none; } /* Parte izquierda del botón 3 */ .Boton3I { /* Tamaño */ width:6px; height:23px; /* Imagen */ background-image:url('/Web/Graficos/Tutorial_HTML5_7_Ejemplo_Boton3.png'); /* Posicionamiento */ float:left; } .Boton3:hover .Boton3I { background-position:0px -75px; } /* Restamos 75 pixeles a la Y */ /* Parte central del botón 3 */ .Boton3C { /* Tamaño */ height:23px; /* Imagen */ background-image:url('/Web/Graficos/Tutorial_HTML5_7_Ejemplo_Boton3.png'); /* Posicionamiento */ background-position:0px -25px; /* Restamos 25 pixeles a la Y */ float:left; padding-top:2px; } .Boton3:hover .Boton3C { background-position:0px -100px; } /* Restamos 100 pixeles a la Y */ /* Parte derecha del botón 3 */ .Boton3D { /* Tamaño */ width:6px; height:23px; /* Imagen */ background-image:url('/Web/Graficos/Tutorial_HTML5_7_Ejemplo_Boton3.png'); /* Posicionamiento */ background-position:0px -50px; /* Restamos 50 pixeles a la Y */ float:left; } .Boton3:hover .Boton3D { background-position:0px -125px; } /* Restamos 125 pixeles a la Y */ /* -[FIN devildrey33.Boton3]- */ Actualización en 5sEsc para cancelar Alt+A para actualizar