Pseudo Mot de passe
fleche Inscription
fleche Mot de passe oublié ?
Informations Générales
Chargement en cours...
Nombre de Visites fleche [ 1 036 258 ]
Votre IP fleche [ 38.107.191.119 ]
Vous êtes ici : Home Page Dossiers Trucs et astuces (CSS) Bouton image pour formulaire
Imprimer le document Version Imprimable

Informations Générales

[425] Posts sur le forum
[453] Membres inscrits
Il y a en ligne :
arrow 0 Membre
arrow 2 Invités
fled Membre en ligne:
Aucun

Partenariat

Partenariat Vous pouvez aider ce site à évoluer, en contribuant à son développement. Proposez vos idées de cours et/ou dossiers.
Rendez-vous dans « Partenariat » pour en savoir plus.

Publicité


Prestataire

N°1 de l'hébergement, location de serveurs, nom de domaines et téléphonie.
(OVH est recommandé par Webelix.net)

www.

Nos Partenaires

Alsacreations
Dreamseed
L'éditeur JavaScript
DicoDuNet
Noogle
Tutopla.net

CSS - Créer un bouton image pour formulaire

Auteur : 3L!X | Créé le : 14/10/2006 à 16H00

Nous allons voir ici comment créer un bouton de type "SUBMIT" (envoi de formulaire), sous forme d'une image.

Bien sûr, il y a la possibilité de changer le type par "IMAGE" pour créer un bouton d'envoi de formulaire, mais il y a un problème avec ce type de bouton.

Et oui, c'est encore IE qui nous pose un problème de compatibilité.
IE n'accepte pas de remplacer notre bouton classique de type "SUBMIT" par un type "IMAGE".

Nous allons donc avoir recoure aux CSS pour arriver à nos fins, en créant une class pour ce bouton.

Exemple de bouton image

Voici l'image :Voici notre class CSS :
button 
.button {
	cursor: pointer;
	width: 69px;
	height: 26px;
	border: none;
	background: url("images/button.gif") no-repeat left top;
}
.button:hover {
	background: url("images/button.gif") no-repeat left bottom;
}

Résultat

<input type="submit" name="envoyer" value=" " class="button" />

[0] commentaire - Voir/EditerAjout commentaire

Haut de page