IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

Mise en page CSS Discussion :

Customisation de boutton


Sujet :

CSS

  1. #1
    Nouveau Candidat au Club
    Femme Profil pro
    Directeur de projet
    Inscrit en
    Mars 2015
    Messages
    3
    Détails du profil
    Informations personnelles :
    Sexe : Femme
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Directeur de projet
    Secteur : Conseil

    Informations forums :
    Inscription : Mars 2015
    Messages : 3
    Points : 1
    Points
    1
    Par défaut Customisation de boutton
    Bonjour !

    Quelqu'un peut-il me dire ce qui ne va pas dans mon css ?
    Objectifs Button :
    - text-color: ‪#‎FFFFFF‬;
    - background-color: ‪#‎e02661‬;

    Button on hover:
    - text-color: #FFFFFF;
    - background-color: #e02661;
    - text-decoration: underline;
    Thanks !
    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
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    .light button,
    .light input[type="submit"],
    .light input[type="button"] {
        border:none;
        display:inline-block;
        text-align:center;
        text-decoration:none;
        cursor:pointer;
        margin-bottom:20px;
        line-height:normal;
        color:#FFFFFF;
        background-color:#e02661;
        padding:8px 12px;
        cursor:pointer;
        text-transform:uppercase;
        letter-spacing:0.5px;
        text-align:center;
        -webkit-transition:0.2s background linear;
        -moz-transition:0.2s background linear;
        transition:0.2s background linear;
        -webkit-border-radius:3px;
        -moz-border-radius:3px;
        border-radius:3px;
        -webkit-box-sizing:border-box;
        -moz-box-sizing:border-box;
        box-sizing:border-box;
        -webkit-background-clip:padding;
        -moz-background-clip:padding;
        background-clip:padding-box;
        -webkit-appearance:none;
        width:auto;
        font-family:'ralewaymedium',Helvetica,Arial,sans-serif;
    }
    .light button:hover,
    .light input[type="submit"]:hover,
    .light input[type="button"]:hover,
    .light button:focus,
    .light input[type="submit"]:focus,
    .light input[type="button"]:focus {
        color:#FFFFFF;
        background-color:#e02661;
        text-decoration:underline;
        border: none;
    }

  2. #2
    Modérateur

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

    Informations forums :
    Inscription : Janvier 2011
    Messages : 16 959
    Points : 44 122
    Points
    44 122
    Par défaut
    Bonjour,
    je n'ai pas vraiment compris ton problème

  3. #3
    Nouveau Candidat au Club
    Femme Profil pro
    Directeur de projet
    Inscrit en
    Mars 2015
    Messages
    3
    Détails du profil
    Informations personnelles :
    Sexe : Femme
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Directeur de projet
    Secteur : Conseil

    Informations forums :
    Inscription : Mars 2015
    Messages : 3
    Points : 1
    Points
    1
    Par défaut
    Haha ! Voici la page source : view-source:boostyourimpact.com/about-us/
    J'aimerais customiser le bouton "Contact us", de façon à ce qu'il soit ainsi :

    - text-color: ‪#‎FFFFFF‬;
    - background-color: ‪#‎e02661‬;
    Button on hover:
    - text-color: #FFFFFF;
    - background-color: #e02661;
    - text-decoration: underline;

    Mais ça ne marche pas

  4. #4
    Modérateur

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

    Informations forums :
    Inscription : Janvier 2011
    Messages : 16 959
    Points : 44 122
    Points
    44 122
    Par défaut
    Il te faut modifier ton fichier CSS concernant cette partie
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    /* Theme Color Button */
    .ut-btn.theme-btn:hover {
    	background:#222222 !important;
    }

  5. #5
    Nouveau Candidat au Club
    Femme Profil pro
    Directeur de projet
    Inscrit en
    Mars 2015
    Messages
    3
    Détails du profil
    Informations personnelles :
    Sexe : Femme
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Directeur de projet
    Secteur : Conseil

    Informations forums :
    Inscription : Mars 2015
    Messages : 3
    Points : 1
    Points
    1
    Par défaut
    Yep !

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    .ut-btn.theme-btn:hover {
    	background:#e02661 !important;
    	text-decoration: underline !important;
    }
    Au poil !!! Merci ! Mon héros... )

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

Discussions similaires

  1. Customiser un boutton
    Par maxwel56 dans le forum Android
    Réponses: 1
    Dernier message: 24/05/2011, 10h11
  2. [VB6] mettre une image sur un boutton
    Par dim dans le forum VB 6 et antérieur
    Réponses: 2
    Dernier message: 15/02/2004, 01h28
  3. [FLASH MX] Prob de compréhension des bouttons
    Par WriteLN dans le forum Flash
    Réponses: 13
    Dernier message: 16/10/2003, 17h01
  4. Savoir sur quel boutton on a cliqué ...
    Par Fofone dans le forum Composants VCL
    Réponses: 8
    Dernier message: 10/03/2003, 16h12
  5. bouttons à répétition
    Par shumy dans le forum C++Builder
    Réponses: 3
    Dernier message: 26/10/2002, 18h16

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