recherche cadre sur l'acceuil

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu recherche cadre sur l'acceuil

Message par mlle Sam 8 Mar 2014 - 15:56

bonjour,
je cherche à faire cette effet un cadre qui flotterais sur la page d'acceuil, mais je ne sais pas comment faire :/
est-ce que quelqu'un saurait ?


Dernière édition par mlle le Dim 9 Mar 2014 - 20:44, édité 1 fois
mlle

mlle
***

Messages : 129
Inscrit(e) le : 07/10/2012

http://concordia-u.forumgratuit.ch/
mlle a été remercié(e) par l'auteur de ce sujet.

Résolu Re: recherche cadre sur l'acceuil

Message par Invité Sam 8 Mar 2014 - 20:57

Salut mlle,

tout se passera par le template pour le contenu, ensuite on donnera un style  pour le rendu  Wink .

Dans le template overall_header:
Affichage/Templates/Général/ overall_header

Recherche ceci:
Code:
<table cellspacing="0" cellpadding="0" border="0" align="{MENU_POSITION}">
 <tr>
 <td align="{MENU_POSITION}"{MENU_NOWRAP}>{GENERATED_NAV_BAR}</td>
 </tr>
 </table>

Juste après colles ceci:

Code:

<div id="M14_bloc_flottant">
  
  <div class="M14_contenant">
    <span class="M14_titre">Contenu texte 1</span><br />
    <span class="M14_titre">Contenu texte 2</span><br />
    <span class="M14_titre">Contenu texte 3</span><br />
    <span><a href="LIEN 1" target="_blank">Contenu lien 1</a></span><br />
    <span><a href="LIEN 2" target="_blank">Contenu lien 2</a></span><br />
  </div>
                            
</div>
J'ai créé trois contenus en texte et deux avec un lien en cas ou ....


Remplaces le texte par ce que tu souhaites ainsi que les liens  Wink .

Pensez a enregistrer les modifications en cliquant respectivement sur recherche cadre sur l'acceuil 907288et recherche cadre sur l'acceuil Ajouter2024


Dans la feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style

Colles ceci:



Code:

/*LE BLOC*/
#M14_bloc_flottant
{
position:fixed;/*on fixe le menu*/
top:10%;/*on le positionne a 10 pourcent du haut*/
left:5%; /*on le positionne a 5 pourcent de la gauche*/
border:1px dashed black;/*le style des bordures*/
background:transparent;/* on demande un fond transparent*/
width:auto;/*on demande une largeur automatique*/
height:auto;/*on demande une hauteur automatique*/
}
/*LE BLOC CONTENANT LES TEXTES ET LES LIENS*/
.M14_contenant
{
background:white;/* on demande une couleur de fond*/
margin:10px 20px 10px 20px; /*on demande des marges 10px haut 20 px droite 10px bas 20px gauche*/
padding:20px 30px 20px 30px;  /*on demande un espace de 20px haut 30px droite 20px bas 30px gauche*/
-webkit-border-radius: 30px;/*les bordures arrondies*/
-moz-border-radius: 30px;
border-radius: 30px;
}
/*LES CONTENANTS TEXTE*/
.M14_contenant span.M14_titre
{
color:black;/*couleur de police*/
font-size:11px;/*taille de police*/
-webkit-transition: color 0.5s ease-in-out;/*les transitions*/
-moz-transition:color 0.5s ease-in-out;
-o-transition: color 0.5s ease-in-out;
transition: color 0.5s ease-in-out;
}
/*LES CONTENANTS TEXTE AU SURVOL*/
.M14_contenant span.M14_titre:hover
{
color:blue;/*couleur de police*/
}
/*LES CONTENANTS LIENS*/
.M14_contenant span a
{
color:red;/*couleur de police*/
font-size:11px;/*taille de police*/
text-decoration:none !important;/*on supprime le soulignement*/
-webkit-transition: color 0.5s ease-in-out;/*les transitions*/
-moz-transition:color 0.5s ease-in-out;
-o-transition: color 0.5s ease-in-out;
transition: color 0.5s ease-in-out;
}
/*LES CONTENANTS LIENS AU SURVOL*/
.M14_contenant span a:hover
{
color:pink;/*couleur de police*/
}

Penses à cliquer sur le boutonrecherche cadre sur l'acceuil Boutonvalider

Amuses toi bien  Very Happy .

a++
Anonymous

Invité
Invité


Invité a été remercié(e) par l'auteur de ce sujet.

Résolu Re: recherche cadre sur l'acceuil

Message par mlle Dim 9 Mar 2014 - 20:44

merci beaucoup, ça marche **
mlle

mlle
***

Messages : 129
Inscrit(e) le : 07/10/2012

http://concordia-u.forumgratuit.ch/
mlle a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut

- Sujets similaires

Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum