1. #1
    Nouveau membre du Club
    Homme Profil pro
    Inscrit en
    mars 2013
    Messages
    57
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : mars 2013
    Messages : 57
    Points : 31
    Points
    31

    Par défaut Mise en forme bouton input

    Bonsoir à tous

    Je suis novice dans la "programmation" je suis entrain de creer un formulaire, j'ai un bouton envoyer et reset que je souhaite modifier l'aspect, j'ai modifier la class mais il prend pas l'aspect que je souhaite, il reste identique.
    le bouton et "input" j'ai voulu prendre l'aspect d'un bouton " li"
    Je vous et le liens de la page avec les 3 boutons, c'est en cours de création, soyez indulgent, les 3 boutons sont "envoyer" et "réinitialiser" c'est cela que je veux modifier et l'autre c'est "comme celui la".
    Voici le lien vers la page : http://yakasolutions.pagesperso-orange.fr/contact2.html

    Merci par avance.

    @+Filou

  2. #2
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    janvier 2011
    Messages
    12 651
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : janvier 2011
    Messages : 12 651
    Points : 32 795
    Points
    32 795

    Par défaut

    Bonjour,
    j'ai modifier la class mais il prend pas l'aspect que je souhaite, il reste identique.
    tu as modifié la classe certes mais qu'as tu mis comme propriétés/valeurs dans cette classe ?

  3. #3
    Nouveau membre du Club
    Homme Profil pro
    Inscrit en
    mars 2013
    Messages
    57
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : mars 2013
    Messages : 57
    Points : 31
    Points
    31

    Par défaut

    Bonjour

    En mettant la class sa reprend pas les mêmes infos les mêmes propriétés que l'autre ?

    Cdlt

    @+Filou

  4. #4
    Nouveau membre du Club
    Homme Profil pro
    Inscrit en
    mars 2013
    Messages
    57
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : mars 2013
    Messages : 57
    Points : 31
    Points
    31

    Par défaut

    quelle difference entre :
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    <ul>
    	<li class="send"><a href="test.html"><i class="fa fa-share"></i>Webmaster</a></li>
    </ul>
    et
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    <input type="submit" class="send" value="Envoyer">

    au niveau de la class les boutons devraient ils pas être identique ?

  5. #5
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    janvier 2011
    Messages
    12 651
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : janvier 2011
    Messages : 12 651
    Points : 32 795
    Points
    32 795

    Par défaut

    Difficile de répondre simplement à tes interrogations !

    au niveau de la class les boutons devraient ils pas être identique ?
    Oui et non cela va dépendre de ce qu'il y a comme régles définies dans la classe.

    Si l'on regarde comment et définie ton lien, balise <a>, on ce rend compte que l'élément hérite de ses parents, c'est le C de CSS pour cascade.

    CSS récupéré (*), et épuré, dans ton document :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    .cBtn ul li {
        border-radius: 4px;
        float: left;
        list-style: none;
        background: #092bf8;
        box-shadow: 0px 2px 0px 0px #000;
    }
    .forma .cBtn .clear, .cBtn .send {
        margin-bottom: 0;
        margin-top: 4px;
        padding: 10px;
        padding-right: 17px;
        padding-left: 17px;
    }
    .cBtn ul li:last-child {
        margin-right: 0;
    }
    .cBtn ul li a {
        text-decoration: none;
        text-transform: uppercase;
        color: #fff;
        font-size: 13px;
        text-align: center;
    }
    .forma .cBtn .clear a, .cBtn .send a {
        font-family: 'Roboto', 'sans-serif';
        font-weight: 700;
    }
    on constate donc qu'il n'y a pas de classe send « directe » et donc si tu l'appliques à ton <input> rien ne sera appliqué.

    En gros à toi de créer ta propre classe à affecter à <input> pour qu'il ressemble à ton <a>, ne pas oublier le changement de couleur au survol.

    Peut être devrais tu jeter un oeil du côté de : Les meilleurs cours et tutoriels pour apprendre le CSS

    (*) dans le navigateur, faire click droit sur l'élément à analyser et choisir dans le menu Inspecter/Examiner l'élément.

  6. #6
    Nouveau membre du Club
    Homme Profil pro
    Inscrit en
    mars 2013
    Messages
    57
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : mars 2013
    Messages : 57
    Points : 31
    Points
    31

    Par défaut

    Bonjour

    Merci pour ton aide c'est bon j'ai créer ma propre class comme vous m'avez dit.
    Je penser qu'en remettant la même class cela était bon, je suis novice dans le sujet.
    Encore merci.

    @+Filou

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. [AC-2010] Mise en forme boutons inaccessible
    Par Dixies dans le forum IHM
    Réponses: 4
    Dernier message: 24/12/2012, 16h11
  2. Affecter une valeur concaténée et mise en forme à un INPUT TEXT
    Par debie1108 dans le forum Général JavaScript
    Réponses: 1
    Dernier message: 04/06/2007, 08h58
  3. Réponses: 3
    Dernier message: 09/08/2006, 08h25
  4. [access2002] [bouton De Mise En Forme]
    Par louroulou dans le forum Access
    Réponses: 1
    Dernier message: 02/06/2006, 18h16
  5. Mise en forme / Alignement de boutons
    Par Sebou77 dans le forum AWT/Swing
    Réponses: 3
    Dernier message: 28/04/2006, 17h29

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo