AccueilAccueil  CalendrierCalendrier  Dernières imagesDernières images  FAQFAQ  RechercherRechercher  MembresMembres  GroupesGroupes  S'enregistrerS'enregistrer  ConnexionConnexion  
-29%
Le deal à ne pas rater :
Pack Smartphone Google Pixel 8a 5G 128 Go + Ecouteurs Google Pixel
469 € 659 €
Voir le deal

 :: Administration :: Votre 1er forumPartagez
 

 Codage de la PA

Voir le sujet précédent Voir le sujet suivant Aller en bas 
AuteurMessage
Admin
Admin
Admin
Messages : 13
Date d'inscription : 21/10/2019


Codage de la PA Empty
Message(#) Sujet: Codage de la PA Codage de la PA EmptyMar 22 Oct - 22:07
Codage d'origine :


Code:
<link href="https://www.aht.li/3201254/FLU_PA.css" rel="stylesheet" type="text/css"><!-- PAGE D'ACCUEIL --><div class="FLU"><!-- STAFF & EVENEMENT EN COURS --><div class="boxFLU"><!-- STAFF - IMAGES EN 125*75 --><div class="staffFLU"><!-- I --><div><!-- IMAGE I --><img src="https://www.aht.li/3201246/12575GREY.png" /><!-- CONTENU I --><p>Pseudonyme<!-- FONCTION & DISPONIBILITE I --><span class="onFLU">Fonction</span><!-- LIEN PROFIL I --><a href="..." target="_blank">Profil</a></p></div><!-- II --><div><!-- IMAGE II --><img src="https://www.aht.li/3201246/12575GREY.png" /><!-- CONTENU II --><p>Pseudonyme<!-- FONCTION & DISPONIBILITE II --><span class="offFLU">Fonction</span><!-- LIEN PROFIL II --><a href="..." target="_blank">Profil</a></p></div><!-- III --><div><!-- IMAGE III --><img src="https://www.aht.li/3201246/12575GREY.png" /><!-- CONTENU III --><p>Pseudonyme<!-- FONCTION & DISPONIBILITE III --><span class="onFLU">Fonction</span><!-- LIEN PROFIL III --><a href="..." target="_blank">Profil</a></p></div><!-- IV --><div><!-- IMAGE IV --><img src="https://www.aht.li/3201246/12575GREY.png" /><!-- CONTENU IV --><p>Pseudonyme<!-- FONCTION & DISPONIBILITE IV --><span class="onFLU">Fonction</span><!-- LIEN PROFIL IV --><a href="..." target="_blank">Profil</a></p></div></div><!-- EVENEMENT EN COURS --><div class="eventFLU"><!-- IMAGE 255*100 --><img src="http://www.aht.li/2911640/255100.png" /><!-- CONTENU --><p><!-- RESUME --><span>Résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé</span><!-- LIEN --><a href="..." target="_blank">plus d'informations ici</a></p></div></div><!-- LIENS & CONTEXTE --><div class="boxFLU"><!-- 6 LIENS --><div class="lksFLU"><!-- I --><a href="..." target="_blank">Lien</a><!-- II --><a href="..." target="_blank">Lien</a><!-- III --><a href="..." target="_blank">Lien</a><!-- IV --><a href="..." target="_blank">Lien</a><!-- V --><a href="..." target="_blank">Lien</a><!-- VI --><a href="..." target="_blank">Lien</a></div><!-- CONTEXTE --><div class="ctxtFLU">Contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte</div></div><!-- PREDEFINIS & NOUVELLES --><div class="boxFLU"><!-- 3 PREDEFINIS EN 60*100 --><div class="pfFLU"><!-- I --><a href="..." target="_blank"><img src="http://www.aht.li/2911667/60100C.png" /></a><!-- II --><a href="..." target="_blank"><img src="http://www.aht.li/2911667/60100C.png" /></a><!-- III --><a href="..." target="_blank"><img src="http://www.aht.li/2911667/60100C.png" /></a><!-- LIEN VERS LE RESTE DES PREDEFINIS --><a class="moreFLU" href="..." target="_blank">ensemble des prédéfinis</a></div><!-- NOUVELLES --><div class="newsFLU">▬ 00/00/00 : ...<br/>▬ 00/00/00 : ...<br/>▬ 00/00/00 : ...</div></div><!-- 12 PARTENAIRES EN 50*50 --><div class="partFLU"><!-- I --><a href="..." target="_blank"><img src="http://www.aht.li/2859284/5050C.png" /></a><!-- II --><a href="..." target="_blank"><img src="http://www.aht.li/2859284/5050C.png" /></a><!-- III --><a href="..." target="_blank"><img src="http://www.aht.li/2859284/5050C.png" /></a><!-- IV --><a href="..." target="_blank"><img src="http://www.aht.li/2859284/5050C.png" /></a><!-- V --><a href="..." target="_blank"><img src="http://www.aht.li/2859284/5050C.png" /></a><!-- VI --><a href="..." target="_blank"><img src="http://www.aht.li/2859284/5050C.png" /></a><!-- VII --><a href="..." target="_blank"><img src="http://www.aht.li/2859284/5050C.png" /></a><!-- VIII --><a href="..." target="_blank"><img src="http://www.aht.li/2859284/5050C.png" /></a><!-- IX --><a href="..." target="_blank"><img src="http://www.aht.li/2859284/5050C.png" /></a><!-- X --><a href="..." target="_blank"><img src="http://www.aht.li/2859284/5050C.png" /></a><!-- XI --><a href="..." target="_blank"><img src="http://www.aht.li/2859284/5050C.png" /></a><!-- XII --><a href="..." target="_blank"><img src="http://www.aht.li/2859284/5050C.png" /></a><!-- LIEN VERS LE RESTE DES PARTENAIRES --><a class="moreIIFLU" href="..." target="_blank">plus ?</a></div></div>

CSS :

Code:
/* PA */
.FLU {
background:black;
}
/* CONTENUS STAFF PA */
.staffFLU p {
background:lightgrey; color:black; /* MODIFIABLE */
}
/* LIENS PROFILS STAFF PA */
.staffFLU a {
color:black !important; /* MODIFIABLE */
}
/* DISPONIBLE PA */
.onFLU {
background:lightgreen; color:black; /* MODIFIABLE */
}
/* INDISPONIBLE PA */
.offFLU {
background:crimson; color:white; /* MODIFIABLE */
}
/* CONTENU EVENEMENT EN COURS PA */
.eventFLU p {
background:#DEDEDE; color:black; /* MODIFIABLE */
}
/* LIEN EVENEMENT EN COURS PA */
.eventFLU a {
background:black; color:white !important; /* MODIFIABLE */
}
/* LIENS PA */
.lksFLU a {
background:#FEFEFE; color:black !important; /* MODIFIABLE */
}
/* CONTEXTE PA */
.ctxtFLU {
background:lightgrey; color:black; /* MODIFIABLE */
}
/* LIEN VERS LE RESTE DES PREDEFINIS PA */
.moreFLU {
background:#E9E9E9; color:black !important; /* MODIFIABLE */
}
/* NOUVELLES */
.newsFLU {
border-color:white !important; color:white; /* MODIFIABLE */
}
/* LIEN VERS LE RESTE DES PARTENAIRES PA */
.moreIIFLU {
background:lightgrey; color:black !important; /* MODIFIABLE */
}
Revenir en haut Aller en bas
https://wanky.forumactif.com
Admin
Admin
Admin
Messages : 13
Date d'inscription : 21/10/2019


Codage de la PA Empty
Message(#) Sujet: Re: Codage de la PA Codage de la PA EmptyMar 22 Oct - 22:08
Codage que j'ai modifié (très peu) :

Code:
<link type="text/css" rel="stylesheet" href="https://www.aht.li/3201254/FLU_PA.css" />
<!--    PAGE D'ACCUEIL    -->
<div class="FLU">
     
   <!--    STAFF & EVENEMENT EN COURS    -->  
   <div class="boxFLU">
        
      <!--    STAFF - IMAGES EN 125*75    -->  
      <div class="staffFLU">
           
         <!--    I    -->  
         <div>
              
            <!--    IMAGE I    --><img src="https://nsa40.casimages.com/img/2019/10/22/mini_191022090405588447.png" />  
            <!--    CONTENU I    -->  
            <p>
                 Pseudonyme  
               <!--    FONCTION & DISPONIBILITE I    --><span class="onFLU">Fondateur</span>  
               <!--    LIEN PROFIL I    --><a target="_blank" href="...">Profil</a>  
            </p>
              
         </div>
           
         <!--    II    -->  
         <div>
              
            <!--    IMAGE II    --><img src="https://nsa40.casimages.com/img/2019/10/22/mini_19102209093984937.png" />  
            <!--    CONTENU II    -->  
            <p>
                 Pseudonyme  
               <!--    FONCTION & DISPONIBILITE II    --><span class="offFLU">Admin</span>  
               <!--    LIEN PROFIL II    --><a target="_blank" href="...">Profil</a>  
            </p>
              
         </div>
           
         <!--    III    -->  
         <div>
              
            <!--    IMAGE III    --><img src="https://nsa40.casimages.com/img/2019/10/22/mini_191022091213808974.png" />  
            <!--    CONTENU III    -->  
            <p>
                 Adaline Nelson
               <!--    FONCTION & DISPONIBILITE III    --><span class="onFLU">Fonction</span>  
               <!--    LIEN PROFIL III    --><a target="_blank" href="...">Profil</a>  
            </p>
              
         </div>
           
         <!--    IV    -->  
         <div>
              
            <!--    IMAGE IV    --><img src="https://www.aht.li/3201246/12575GREY.png" />  
            <!--    CONTENU IV    -->  
            <p>
                 Pseudonyme  
               <!--    FONCTION & DISPONIBILITE IV    --><span class="onFLU">Fonction</span>  
               <!--    LIEN PROFIL IV    --><a target="_blank" href="...">Profil</a>  
            </p>
              
         </div>
           
      </div>
        
      <!--    EVENEMENT EN COURS    -->  
      <div class="eventFLU">
           
         <!--    IMAGE 255*100    --><img src="http://www.aht.li/2911640/255100.png" />  
         <!--    CONTENU    -->  
         <p>
              
            <!--    RESUME    --><span>Résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé résumé</span>  
            <!--    LIEN    --><a target="_blank" href="...">plus d'informations ici</a>  
         </p>
           
      </div>
        
   </div>
     
   <!--    LIENS & CONTEXTE    -->  
   <div class="boxFLU">
        
      <!--    6 LIENS    -->  
      <div class="lksFLU">
           
         <!--    I    --><a target="_blank" href="...">Lien</a>  
         <!--    II    --><a target="_blank" href="...">Lien</a>  
         <!--    III    --><a target="_blank" href="...">Lien</a>  
         <!--    IV    --><a target="_blank" href="...">Lien</a>  
         <!--    V    --><a target="_blank" href="...">Lien</a>  
         <!--    VI    --><a target="_blank" href="...">Lien</a>  
      </div>
        
      <!--    CONTEXTE    -->  
      <div class="ctxtFLU">
           Contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte  
      </div>
        
   </div>
     
   <!--    PREDEFINIS & NOUVELLES    -->  
   <div class="boxFLU">
        
      <!--    3 PREDEFINIS EN 60*100    -->  
      <div class="pfFLU">
           
         <!--    I    --><a target="_blank" href="..."><img src="http://www.aht.li/2911667/60100C.png" /></a>  
         <!--    II    --><a target="_blank" href="..."><img src="http://www.aht.li/2911667/60100C.png" /></a>  
         <!--    III    --><a target="_blank" href="..."><img src="http://www.aht.li/2911667/60100C.png" /></a>  
         <!--    LIEN VERS LE RESTE DES PREDEFINIS    --><a target="_blank" href="..." class="moreFLU">ensemble des prédéfinis</a>  
      </div>
        
      <!--    NOUVELLES    -->  
      <div class="newsFLU">
           ▬ 00/00/00 : ...<br />▬ 00/00/00 : ...<br />▬ 00/00/00 : ...  
      </div>
        
   </div>
     
   <!--    12 PARTENAIRES EN 50*50    -->  
   <div class="partFLU">
        
      <!--    I    --><a target="_blank" href="..."><img src="http://www.aht.li/2859284/5050C.png" /></a>  
      <!--    II    --><a target="_blank" href="..."><img src="http://www.aht.li/2859284/5050C.png" /></a>  
      <!--    III    --><a target="_blank" href="..."><img src="http://www.aht.li/2859284/5050C.png" /></a>  
      <!--    IV    --><a target="_blank" href="..."><img src="http://www.aht.li/2859284/5050C.png" /></a>  
      <!--    V    --><a target="_blank" href="..."><img src="http://www.aht.li/2859284/5050C.png" /></a>  
      <!--    VI    --><a target="_blank" href="..."><img src="http://www.aht.li/2859284/5050C.png" /></a>  
      <!--    VII    --><a target="_blank" href="..."><img src="http://www.aht.li/2859284/5050C.png" /></a>  
      <!--    VIII    --><a target="_blank" href="..."><img src="http://www.aht.li/2859284/5050C.png" /></a>  
      <!--    IX    --><a target="_blank" href="..."><img src="http://www.aht.li/2859284/5050C.png" /></a>  
      <!--    X    --><a target="_blank" href="..."><img src="http://www.aht.li/2859284/5050C.png" /></a>  
      <!--    XI    --><a target="_blank" href="..."><img src="http://www.aht.li/2859284/5050C.png" /></a>  
      <!--    XII    --><a target="_blank" href="..."><img src="http://www.aht.li/2859284/5050C.png" /></a>  
      <!--    LIEN VERS LE RESTE DES PARTENAIRES    --><a target="_blank" href="..." class="moreIIFLU">plus ?</a>  
   </div>
</div>

Et le CSS :

Code:
/* PA */
.FLU {
background:black;
}
/* CONTENUS STAFF PA */
.staffFLU p {
background:lightgrey; color:black; /* MODIFIABLE */
}
/* LIENS PROFILS STAFF PA */
.staffFLU a {
color:black !important; /* MODIFIABLE */
}
/* DISPONIBLE PA */
.onFLU {
background:lightgreen; color:black; /* MODIFIABLE */
}
/* INDISPONIBLE PA */
.offFLU {
background:crimson; color:white; /* MODIFIABLE */
}
/* CONTENU EVENEMENT EN COURS PA */
.eventFLU p {
background:#DEDEDE; color:black; /* MODIFIABLE */
}
/* LIEN EVENEMENT EN COURS PA */
.eventFLU a {
background:black; color:white !important; /* MODIFIABLE */
}
/* LIENS PA */
.lksFLU a {
background:#FEFEFE; color:black !important; /* MODIFIABLE */
}
/* CONTEXTE PA */
.ctxtFLU {
background:lightgrey; color:black; /* MODIFIABLE */
}
/* LIEN VERS LE RESTE DES PREDEFINIS PA */
.moreFLU {
background:#E9E9E9; color:black !important; /* MODIFIABLE */
}
/* NOUVELLES */
.newsFLU {
border-color:white !important; color:white; /* MODIFIABLE */
}
/* LIEN VERS LE RESTE DES PARTENAIRES PA */
.moreIIFLU {
background:lightgrey; color:black !important; /* MODIFIABLE */
}
Revenir en haut Aller en bas
https://wanky.forumactif.com
 

Codage de la PA

Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 1

 Sujets similaires

-
» Codage fiche de présentation
» Codage fiche de scénario

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
 :: Administration :: Votre 1er forum-