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 :

[CSS] débutante : un entête fixe avec image dans le CSS


Sujet :

CSS

  1. #1
    Membre expert
    Avatar de khany
    Profil pro
    Inscrit en
    Octobre 2002
    Messages
    2 073
    Détails du profil
    Informations personnelles :
    Âge : 62
    Localisation : Belgique

    Informations forums :
    Inscription : Octobre 2002
    Messages : 2 073
    Points : 3 890
    Points
    3 890
    Par défaut [CSS] débutante : un entête fixe avec image dans le CSS
    Bonjour !

    Je débute avec les CSS et je me demande comment placer dans la CSS l'équivalent de ce code HTML qui place mon image d'entête :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
     
    <div id="entete">
    <table border="0" align="center">
    	<tr>
    		<td><img src="images/logo.gif" border="0" width="68" height="75" alt="" align="left"></td>
    		<td width="340"><img src="images/etsro.gif" border="0" width="315" height="57" alt="" align="middle"></td>
    		<td><img src="images/logo.gif" border="0" width="68" height="75" alt="" align="left"></td>
    	</tr>
    </table>
    </div>
    bien que j'ai déjà défini #entete dans la CSS :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
     
    #entete {
    background-color: silver; 
    height: 100 px; 
    margin-bottom: 5px
    }
    je cale bêtement sur le fait d'éviter le même code HTML dans chaque page puisque mon entête ne change pas

    Merci !

  2. #2
    Membre à l'essai
    Profil pro
    Inscrit en
    Mai 2005
    Messages
    22
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2005
    Messages : 22
    Points : 21
    Points
    21
    Par défaut
    Salut,

    voici comment faire:
    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
    <html><head><title>Positionnement css</title><style>
    <!--
     
    #entete {
    width: 476px;
    height: 100px;
    margin: 0 auto 5px auto;/*Centre le div entete*/
    } 
     
    /*Taille des images logo et alignement à gauche*/
    img.logo {
    width: 68px;
    height: 75px;
    float:left; }
     
    /*Taille du conteneur central et alignement à gauche (du conteneur!)*/
    #centre {
    background-color: silver;
    width: 340px;
    height: 75px;
    float: left; }
     
    /*Taille de l'image centrale, transformation en bloc puis centrage au sein de la div*/
    #centre img {
    width: 315px;
    height: 57px;
    display: block;
    margin: auto; }
     
    //-->
    </style></head><body>
     
    <div id="entete">
    <img src="images/logo.gif" alt="" class="logo">
    <div id="centre"><img src="images/etsrolans.gif" alt=""></div>
    <img src="images/logo.gif" alt="" class="logo">
    </div> 
     
    </body></html>
    A retenir:

    -id pour les éléments uniques et class pour les éléments pluriels...

    @+

  3. #3
    Membre expert
    Avatar de khany
    Profil pro
    Inscrit en
    Octobre 2002
    Messages
    2 073
    Détails du profil
    Informations personnelles :
    Âge : 62
    Localisation : Belgique

    Informations forums :
    Inscription : Octobre 2002
    Messages : 2 073
    Points : 3 890
    Points
    3 890
    Par défaut
    merci pour l'aide !

    Ca me permet d'avancer et je commence à vraiment comprendre la logique CSS

    Merci !

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

Discussions similaires

  1. [SWT] Problème avec images dans Table
    Par dalma dans le forum SWT/JFace
    Réponses: 2
    Dernier message: 06/11/2009, 16h25
  2. [JLabel] texte HTML avec image dans un JAR
    Par matt11 dans le forum Composants
    Réponses: 5
    Dernier message: 18/08/2008, 13h53
  3. [Débutant] problème de preload avec image
    Par arnofly dans le forum ActionScript 1 & ActionScript 2
    Réponses: 1
    Dernier message: 12/02/2008, 19h48
  4. Réponses: 1
    Dernier message: 18/06/2007, 22h15
  5. Problème avec image dans JPanel
    Par littleshrimp dans le forum AWT/Swing
    Réponses: 7
    Dernier message: 14/05/2006, 14h05

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