LS For Everyone
LS for everyone

Forum de Libre Service - Codage et Graphisme

-39%
Le deal à ne pas rater :
Ordinateur portable ASUS Chromebook Vibe CX34 Flip
399 € 649 €
Voir le deal

    Fiches officielles simples

    Adèlys
    Adèlys
    Adèlys
    Admin


    Messages : 42
    Date d'inscription : 08/03/2018
    • Message n°1

    Fiches officielles simples Empty Fiches officielles simples

    Message par Adèlys Lun 12 Mar - 19:13


       Le titre de base
     

     
    >> Un premier titre


    Blabla


    >> Un second titre

    Bla bla



    Le CSS :

    Code:
    /* --------- FICHE OFFICIELLE ---------- */

    /* Corps Fiche */

    .corFICO {
      width:500px;
      background-color:white;
      padding:0;
      margin-left:auto;
      margin-right:auto;
      border:1px solid grey;
    }

    .titFICO {
      text-transform:uppercase;
      font-size:20px;
      font-style:italic;
      color:grey;
      font-family:Arial;
      font-weight:bold;
    }

    .corFICO p, .blabla {
      padding:20px;
      font-family:Arial;
      color:black;
      font-size:12px;
      text-align:justify;
    }

    .imgFICO {
      margin:0;
      width:100%;
      background-size:cover;
      height:150px;
      text-align:center;
      padding-top:25%;
    }

    .imgFICO span {
      color:white;
      font-family:'Oleo Script',cursive;
      font-size:30px;
    }

    /* ---------- FIN FICHE OFFICIELLE ---------- */

    Le code (sans CSS) :

    Code:
    <div class="corFICO"><div class="imgFICO" style="background:url('https://i.pinimg.com/564x/cc/0d/6f/cc0d6ff4338f318973735fa9e0a6394c.jpg') no-repeat;">
       <span>Le titre de base</span>
     </div>
     <div class="blabla"><span class="titFICO">>> Un premier titre</span>


    Blabla


    <span class="titFICO">>> Un second titre</span>

    Bla bla</div>
    </div>

    Le code en entier (avec CSS) :

    Code:
    <style>.corFICO{width:500px;background-color:white;padding:0;margin-left:auto;margin-right:auto;border:1px solid grey;}.titFICO{text-transform:uppercase;font-size:20px;font-style:italic;color:grey;font-family:Arial;font-weight:bold;}.corFICO p, .blabla {padding:20px;font-family:Arial;color:black;font-size:12px;text-align:justify;}.imgFICO{margin:0;width:100%;background-size:cover;height:150px;text-align:center;padding-top:25%;}.imgFICO span {color:white;font-family:'Oleo Script',cursive;font-size:30px;}</style><div class="corFICO"><div class="imgFICO" style="background:url('https://i.pinimg.com/564x/cc/0d/6f/cc0d6ff4338f318973735fa9e0a6394c.jpg') no-repeat;">
       <span>Le titre de base</span>
     </div>
     <div class="blabla"><span class="titFICO">>> Un premier titre</span>


    Blabla


    <span class="titFICO">>> Un second titre</span>

    Bla bla</div>
    </div>
    • Revenir en haut
      La date/heure actuelle est Jeu 9 Mai - 11:32


      Partenaires