Un arriere pland pour un titre

Résolu
nes t -  
nes t Messages postés 12 Date d'inscription   Statut Membre Dernière intervention   -
Bonjour,
dans le cadre de 1 de mes cours on va cree des peges web,pour ma page je veux que mon titre apparaitre avec un arrier plan (image)et pas tout la page ,que je peux fair ???
merci
j'attend la reponse svp
bye bye
A voir également:

4 réponses

warlix Messages postés 1201 Date d'inscription   Statut Contributeur Dernière intervention   288
 
salut

il te suffis de mettre dans ton css un background-image et d'écrire par dessus

mais le site est en cadre ? div ? etc ...

dans le cas d un div tu fais

<body>

<div id="header"></div>



dans le css tu fais

body {

background-image: url de ton image;
tu fais un center au besoin
tu fais un no-repeat si besoin

}

etc....

dans ta page HTML et dans le div header tu écris le texte de ton titre en <h1>titre</h1>
un truc du genre quoi.
0
Gihef Messages postés 5150 Date d'inscription   Statut Contributeur Dernière intervention   2 779
 
Bonjour,

Pour être plus précis, l'arrière-plan serait mieux dans une balise qui concerne les titres, <h1>, <h2>…

Par exemple, ici de 1er et 2e niveau, <h1> et <h2>.
On définit une fois le style et à chaque fois qu'on utilise un <h2>, il se présente de la même manière :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Des sous-titres avec image</title>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8">
    <style type="text/css">
    html, body {
      margin: 0;
      padding: 0;
      text-align: center;
      background-color: #b0c4de;
      }
    #conteneur {
      position: relative;
      margin: 0 auto;
      width: 760px;
      text-align: left;
      border : 1px solid #f0ffff;
      background-color: #f0f8ff;
      font-family: Verdana, sans-serif;
      }
    h1, h2 {
      background : #fff url(http://cjoint.com/data/ltwVPMUEVi_aph2.png) left top no-repeat;
      width : 444px;
      height : 58px;
      line-height : 70px;
      margin-left : 20px;
      padding-left : 20px;
      color : #00bfff;
      border-left : 15px solid  #00bfff;
      }
    h1 {
      height : 78px;
      line-height : 98px;
      }
    </style>
</head>
<body>
  <div id="conteneur">
    <h1>Titre</h1>
    <p>&nbsp;<br><br><br>&nbsp;</p>
    <h2>Premier sous-titre</h2>
    <p>&nbsp;<br><br><br>&nbsp;</p>
    <h2>Deuxième sous-titre</h2>
    <p>&nbsp;<br><br><br>&nbsp;</p>
    <h2>Troisième sous-titre</h2>
    <p>&nbsp;<br><br><br>&nbsp;</p>
  </div>
</body>
</html>

--
0
nes tt
 
Bonjour,
Je vous remercie les deux "warlix" et "Gihef", je m'excuse pour le retard de la réponse, je n’ai pas retourné au site car c’est était prévu que je reçois les réponses par e-mail, mais!!
Je n'ai pas encore rendu au css, c'est la prochaine étape, je vais exécuter ça et je vous envierai un msg à propos des résultats.
Merci encore une fois
Bonne soirée

nes
0
nes t Messages postés 12 Date d'inscription   Statut Membre Dernière intervention   1
 
J’ai oublié de répondre à la question de warlix
Oui mon titre est en h1, le voici:

<h1><img src="../images/beaucoup de neige.jpg" alt="photo avec beaucoup de neige" />titre<h1/>
Maintenant mon image apparaitre en haut du titre.

C bon!
bye
0