Sujet Précédent Sujet Suivant

Mise en page d'un site web

Fermé
PaulineCdr Messages postés 9 Date d'inscription mercredi 16 décembre 2020 Statut Membre Dernière intervention 19 décembre 2020 - 16 déc. 2020 à 22:18
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 - 18 déc. 2020 à 00:16
Bonjour,
J'aimerais aligner mon texte et mes images sur ce site web


comme sur ce shéma


Je n'arrive pas à trouver la solution, pourriez-vous m'aider ?

Configuration: Windows / Chrome 87.0.4280.88
A voir également:

5 réponses

Réponse 1 / 5
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
16 déc. 2020 à 23:33
Bonjour,

Sans voir ton code html .. impossible de te répondre !
A noter que ça passera forcément par du css ...

NB: Pour poster ton code sur le forum, tu devras utiliser les BALISES DE CODE.
Explications ( à lire ENTIEREMENT !! ) disponibles ici : https://codes-sources.commentcamarche.net/faq/11288-les-balises-de-code
0
Réponse 2 / 5
PaulineCdr Messages postés 9 Date d'inscription mercredi 16 décembre 2020 Statut Membre Dernière intervention 19 décembre 2020
16 déc. 2020 à 23:43
Bonjour,

Je n'y connais pas grand chose alors je vous ai fait une capture d'écran. J'espère que cela suffira.
0
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
16 déc. 2020 à 23:44
Tu as beau ne pas t'y connaitre ... si tu ne lis pas correctement les réponses qu'on te donne .. on n'avancera pas vite ....

Relis bien ma précédente réponse et poste nous ton code correctement !
0
Réponse 3 / 5
PaulineCdr Messages postés 9 Date d'inscription mercredi 16 décembre 2020 Statut Membre Dernière intervention 19 décembre 2020
16 déc. 2020 à 23:51
J'espère que c'est ça : 

<html>
<head>
	<meta charset="utf-8" />
  <title>Programmation</title>
   <link href="style.css" rel="stylesheet" type="text/css" />
</head>

<body> <h1>Programmation </h1>  

<h1> <a href="billeterie.html"  target="_blank" > Samedi </a> </h1>  

<h2> <a href="https://fr.wikipedia.org/wiki/Nolwenn_Leroy"  target="_blank" > Nolwenn Leroy </a> <figure> <img src="https://upload.wikimedia.org/wikipedia/commons/b/b1/Nolwenn_Leroy_2011_2.jpg" /> </figure> </h2> <br> 
<p>  Chanteuse née le 28 septembre 1982 à Saint-Renan dans le Finistère. Elle a gagné la deuxième saison de la Star Academy et détient maintenant 7 albums. C'est également la marraine de la Fondation Abbé-Pierre et est membre des Enfoirés depuis 2006.  </p> <br> 

<h2> <a href="https://fr.wikipedia.org/wiki/Alan_Stivell"  target="_blank" > Alan Stivell </a> <figure> <img src="https://upload.wikimedia.org/wikipedia/commons/1/1f/Festival_de_Cornouaille_2016_-_Alan_Stivell_-_01.jpg" /> </figure> </h2> <br> 
<p>  Chanteur né le 6 janvier 1944 à Riom en Auvergne. Il milite pour la culture et la langue bretonne et joue plusieurs instruments dont la harpe celtique, le piano ou encore la flûte irlandaise. C'est le premier chanteur breton professionnel qui utilise la langue bretonne.  </p> <br> 
<h2> <a href="https://fr.wikipedia.org/wiki/Matmatah"  target="_blank" > Matmatah </a> <figure> <img src="https://upload.wikimedia.org/wikipedia/commons/9/98/Matmatah_Plougastel_02-2017_-_42.jpg" /> </figure> </h2> <br> 
<p>  Groupe de rock et de folk breton créé à Brest en 1995. Ils ont vendu 1 300 000 albums et ont récolté 3 disques d'or + 1 disque de platine. Après 13 ans d'activités, le groupe se sépare en 2008 puis se reforme en 2016. </p> <br> 
<h2> <a href="https://fr.wikipedia.org/wiki/Kern_(groupe)"  target="_blank" > Kern </a> <figure> <img src="https://upload.wikimedia.org/wikipedia/commons/e/eb/Festival_de_Cornouaille_2017_-_Kristen_ha_Kelenn_Nikolas_-_13.jpg" /> </figure> </h2> <br> 
<p>  Groupe de musique bretonne créé en 1992. En 2002, le groupe annonce une pause et reviennent dix ans après avec une nouvelle tournée.  </p> <br> 
<h2> <a href="https://fr.wikipedia.org/wiki/Anne_Auffret"  target="_blank" > Anne Auffret </a> <figure> <img src="https://upload.wikimedia.org/wikipedia/commons/3/3b/Anne_Auffret_Annie_Ebrel_Loc-Envel_2016.jpg" /> </figure> </h2> <br> 
<p>  Chanteuse bretonne originaire de Bulat-Pestiven. Elle est également harpiste et a reçu le prix Imram qui est un prix attribué pour l'ensemble d'une oeuvre en langue bretonne.   </p> <br> 
<h2> <a href="https://fr.wikipedia.org/wiki/Tri_Yann"  target="_blank" > Tri Yann </a>  <figure> <img src="https://upload.wikimedia.org/wikipedia/commons/e/ea/Photo_-_Festival_de_Cornouaille_2012_-_Tri_Yann_en_concert_le_28_juillet_-_029.jpg" /> </figure> </h2> <br> 
<p>  Groupe de folk rock français créé en 1969 à Nantes. Initialement, le groupe réinterprétait des chansons traditionnelles bretonnes mais ils ont fini par créer leur propre répertoire original e, français et en breton.  </p> <br> 
<h2> <a href="https://fr.wikipedia.org/wiki/Annie_Ebrel"  target="_blank" > Annie Ebrel </a> <figure> <img src="https://upload.wikimedia.org/wikipedia/commons/1/1c/Annie_Ebrel_%26_Nol%C3%B9en_Le_Buh%C3%A9_-_Festival_Yaouank_2015_-_05.jpg" /> </figure> </h2> <br> 
<p>  Chanteuse française d'expression bretonne, née en 1969. Elle est ambassadrice du chant breton en France et à l'étranger dans des pays comme la Russie, l'Italie, l'Espagne, la Scandinavie, le Québec, les Etats-Unis ou encore la pologne.  </p> <br> 
<h2> <a href="https://fr.wikipedia.org/wiki/Denez_Prigent"  target="_blank" > Denez Prigent </a>  <figure> <img src="https://upload.wikimedia.org/wikipedia/commons/8/8b/Denez_Prigent_%26_Fr%C3%A8res_Guichen_-_Festival_Yaouank_2016_-_05.jpg" /> </figure> </h2> <br> 
<p>  Chanteur français interprétant des chants bretons. Il est né le 17 février 1966 à Brest. Il détient sept albums et performe régulièrement en France et dans d'autres pays.   </p> <br> 

<h1> <a href="billeterie.html"  target="_blank" > Dimanche </a> </h1> <br> 

<h2> <a href= "https://fr.wikipedia.org/wiki/Les_Ramoneurs_de_menhirs"  target="_blank" > Les Ramoneurs de Menhirs  </a> <figure> <img src="https://upload.wikimedia.org/wikipedia/commons/e/e1/Les_Ramoneurs_de_Menhirs_%C3%A0_Plouha_en_2019.jpg" /> </figure> </h2> <br> 
<p>  Groupe de punk celtique français formé en 2006 en Bretagne. Le groupe est aussi connu en France qu'à l'étranger et comptabilise en 2016 sa dixième tournée. </p> <br> 
<h2> <a href="https://fr.wikipedia.org/wiki/Manau"  target="_blank" > Manau </a>  <figure> <img src="http://generations.fr/media/news/thumb/870x489_manu-13932.png" /> </figure> </h2> <br> 
<p>  Groupe de slam d'inspiration celtique, connu pour leur célèbre titre "La tribu de Dana". Le groupe est actif depuis la fin des années 90 et comptabilise 8 albums. Ils ont été récompensés par la Victoire de la musique du "meilleur album rap ou groove de l'année. </p> <br> 
<h2> <a href="https://fr.wikipedia.org/wiki/Soldat_Louis"  target="_blank" > Soldat Louis </a> <figure> <img src="https://upload.wikimedia.org/wikipedia/commons/7/7a/Festival_de_Cornouaille_2016_-_Soldat_Louis_-_29.jpg" /> </figure> </h2> <br> 
<p>  Groupe de musique traditionnelle bretonne mélangé au rock, créé à Lorient en 1987. Ils comptabilisent aujourd'hui treize albums. </p> <br> 
<h2> <a href="https://fr.wikipedia.org/wiki/Dan_Ar_Braz"  target="_blank" > Dan Ar Braz </a> <figure> <img src="https://upload.wikimedia.org/wikipedia/commons/1/11/Photo_-_Festival_de_Cornouaille_2013_-_Dan_Ar_Braz_C%C3%A9l%C3%A9brations_le_27_juillet_-_029.jpg" /> </figure> </h2> <br> 
<p>  Chanteur breton né le 15 janvier 1949 à Quimper. Il rejoint l'Héritage des Celtes en 1993 puis se retranche dans sa carrière solo en 2002. En 1996, il représente la France au concours de l'Eurovision avec une chanson bretonne. </p> <br> 
<h2> <a href="https://fr.wikipedia.org/wiki/Louis_Capart"  target="_blank" > Louis Capart </a> <figure> <img src="https://upload.wikimedia.org/wikipedia/commons/6/66/Louis_Capart_-_%C3%8Ele_de_Sein.jpg" /> </figure> </h2> <br> 
<p>  Chanteur d'expression française et bretonne, né le 31 août 1947 à Paris. Il a reçu le Grand Prix de l'Académie Charles-Cros en 1986 et le prix René Jeanne de la SACEM l'année d'après pour son album "Patience". <br> 
<h2> <a href="https://fr.wikipedia.org/wiki/Dom_DufF"  target="_blank" > Dom DufF </a> <figure> 
<img src="https://upload.wikimedia.org/wikipedia/commons/c/c9/Dom_DufF_en_juin_2019.jpg" /> </figure>
 </h2> <br> 
<p>  Chanteur breton né le 20 août 1960 à Plouescat dans le Nord du Finistère. Il commence sa carrière solo en 2000 après 9 ans en tant que membre du groupe "Diwell". Il comptabilise à présent 7 albums.  </p> <br> 
<h2> <a href="https://fr.wikipedia.org/wiki/Gwennyn"  target="_blank" > Gwennyn </a>  <figure>
<img src="https://upload.wikimedia.org/wikipedia/commons/8/82/Festival_de_Cornouaille_2017_-_Gwennyn_-_01.jpg" />
</figure> <br> 
</h2>
<p>  Chanteuse bretonne née le 27 juin 1974 à Rennes. Reconnue à l'étranger, elle est devenue une des ambassatrices de la chanson bretonne contemporaine et de la musique pop-rock celtique. Elle a reçu 5 recompenses dont le Grand prix du disque Produit en Bretagne.  </p> <br> 
<h2> <a href="https://fr.wikipedia.org/wiki/Nolwenn_Korbell"  target="_blank" > Nolwenn Korbell </a>  
<figure>  <br> 
<img src="file:///C:/Users/Pauline%20Cadro/Desktop/DOSSIER/LEA/L3/Media/Nolwenn_Korbell_-_Ty_Th%C3%A9%C3%A2tre.jpg" /> 
</figure> <br> 
</h2>
<p>  Chanteuse bretonne née le 3 février à Quimper. Reconnue à l'étranger, elle possède 6 albums studio et participe également à des pièces de théâtre, du doublage de films et de dessins animés.  </p> <br> 



</body>
</html>
0
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
16 déc. 2020 à 23:55
C'est bien ça.

Par contre il va également nous falloir le contenu de ton fichier style.css

NB: Pour tes prochains codes, essaye de les identer un minimum... ça les rendra beaucoup plus lisibles.
0
Réponse 4 / 5
PaulineCdr Messages postés 9 Date d'inscription mercredi 16 décembre 2020 Statut Membre Dernière intervention 19 décembre 2020
17 déc. 2020 à 00:08
Je ne sais pas ce que veut dire identer mais j'espère que ça reste quand même lisible 

 
h1 {
font-family : bree serif ;
font-size : 60px ;
font-weight : bold ;
color : #163573 ;
text-align : center ; 
text-decoration : none ;

}

a {
text-decoration : none ;
color : #163573 ;

} 

a[target=_blank]:link { color : #F2CB05 ;
font-family : bree serif ;
font-size : 35px ;
font-weight : normal ; 
text-decoration : underline ; 
text-align : left ; 	}
a[target=_blank]:visited{color : #F2CB05 ;
font-family : bree serif ;
font-size : 35px ;
font-weight : normal ; 
text-decoration : underline ; 
text-align : left ; } 
a[target=_blank]:hover{color : #F2CB05 ;
font-family : bree serif ;
font-size : 35px ;
font-weight : normal ; 
text-decoration : underline ; 
text-align : left ; } 
a[target=_blank]:focus{color : #F2CB05 ;
font-family : bree serif ;
font-size : 35px ;
font-weight : normal ; 
text-decoration : underline ; 
text-align : left ;  }
a[target=_blank]:active{color : #F2CB05 ;
font-family : bree serif ;
font-size : 35px ;
font-weight : normal ; 
text-decoration : underline ; 
text-align : left ;  }

h2 {
font-family : bree serif ;
font-size : 35px ;
font-weight : normal ; 
text-decoration : underline ; 
color : #F2CB05 ;
text-align : left ;
}

p{
font-family : monospace ;
color : #163573 ;
text-align : left ;
}


img { 
width : 20%;
height : 20%  ; 
float:left ; 
margin:15px ;
text-align:right;
}
 
body{
background-color : white ;
	
	
}
0
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
17 déc. 2020 à 01:03
https://www.google.com/search?q=indenter
0
PaulineCdr Messages postés 9 Date d'inscription mercredi 16 décembre 2020 Statut Membre Dernière intervention 19 décembre 2020 > jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024
17 déc. 2020 à 08:12 
 h1 {
font-family : bree serif ;
font-size : 60px ;
font-weight : bold ;
color : #163573 ;
text-align : center ; 
text-decoration : none ;

}

a {
text-decoration : none ;
color : #163573 ;

} 

a[target=_blank]:link { color : #F2CB05 ;
font-family : bree serif ;
font-size : 35px ;
font-weight : normal ; 
text-decoration : underline ; 
text-align : left ; 	}
a[target=_blank]:visited{color : #F2CB05 ;
font-family : bree serif ;
font-size : 35px ;
font-weight : normal ; 
text-decoration : underline ; 
text-align : left ; } 
a[target=_blank]:hover{color : #F2CB05 ;
font-family : bree serif ;
font-size : 35px ;
font-weight : normal ; 
text-decoration : underline ; 
text-align : left ; } 
a[target=_blank]:focus{color : #F2CB05 ;
font-family : bree serif ;
font-size : 35px ;
font-weight : normal ; 
text-decoration : underline ; 
text-align : left ;  }
a[target=_blank]:active{color : #F2CB05 ;
font-family : bree serif ;
font-size : 35px ;
font-weight : normal ; 
text-decoration : underline ; 
text-align : left ;  }

h2 {
font-family : bree serif ;
font-size : 35px ;
font-weight : normal ; 
text-decoration : underline ; 
color : #F2CB05 ;
text-align : left ;
}

p{
font-family : monospace ;
color : #163573 ;
text-align : left ;
}


img { 
width : 20%;
height : 20%  ; 
float:left ; 
margin:15px ;
text-align:right;
}
 
body{
background-color : white ;
	
	
}
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Réponse 5 / 5
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
17 déc. 2020 à 12:04
Voici un début de réponse.

Je te laisse adapter à tes besoins 

<html>
  <head>
    <meta charset="utf-8" />
    <title>Programmation
    </title>
    <link href="style.css" rel="stylesheet" type="text/css" />
    <style>
      .gauche{
        float: left;

      }
      .droite{
        float: right;
      }
      .events{
        display: inline-block;
      }
      .event-date{
        margin:4px;
        text-align:left;
      }
      .event-item{
        display: inline-block;
        vertical-align: top;
      }

      .event-item > .image{
        display:inline;
        width:40%;
      }

      .event-item .description{
        width:60%;
      }
      .event-item > .image > figure > img{
        max-width:200px;

      }

      .description{
        font-style: italic;
      }
    </style>
  </head>

  <body> 
    <h1>
      Programmation 
    </h1>  
    <div class="events">
      <div class="event-date">
        <h1> 
          <a href="billeterie.html"  target="_blank" > Samedi 
          </a> 
        </h1>  
      </div>
      <div class="event-item">
        <div class="description gauche">
          <h2> 
            <a href="https://fr.wikipedia.org/wiki/Nolwenn_Leroy"  target="_blank" >
              Nolwenn Leroy 
            </a> 
          </h2>
          <p>  Chanteuse née le 28 septembre 1982 à Saint-Renan dans le Finistère. 
            Elle a gagné la deuxième saison de la Star Academy et détient maintenant 7 albums. 
            C'est également la marraine de la Fondation Abbé-Pierre et est membre des Enfoirés depuis 2006.  
          </p> 
        </div>
        <div class="image droite">
          <figure> 
            <img src="https://upload.wikimedia.org/wikipedia/commons/b/b1/Nolwenn_Leroy_2011_2.jpg" /> 
          </figure> 
        </div>

      </div>

      <div class="event-item">
        <div class="description droite">
          <h2> 
            <a href="https://fr.wikipedia.org/wiki/Nolwenn_Leroy"  target="_blank" >
              Nolwenn Leroy 
            </a> 
          </h2>
          <p>  Chanteuse née le 28 septembre 1982 à Saint-Renan dans le Finistère. 
            Elle a gagné la deuxième saison de la Star Academy et détient maintenant 7 albums. 
            C'est également la marraine de la Fondation Abbé-Pierre et est membre des Enfoirés depuis 2006.  
          </p> 
        </div>
        <div class="image gauche">
          <figure> 
            <img src="https://upload.wikimedia.org/wikipedia/commons/b/b1/Nolwenn_Leroy_2011_2.jpg" /> 
          </figure> 
        </div>

      </div>


    </div>
  </body>

</html>


NB: Là .. tu peux voir mon code indenté .....
L'indentation, c'est le "décallage" ( avec des espaces ou des tabulations...) qui permet de voir à quel bloc html appartiennent tels ou tels éléments ... ou quelle ligne de "code" css se trouve dans quoi ...
Bref, je te laisse relire les définitions(certainement plus précises, et plus claires que tu pourras trouver sur internet) concernant l'indentation en programmation.


0
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
18 déc. 2020 à 00:16
Vu que tu as déjà posté une autre question ... pense à mettre celle-ci en RESOLUE.
Merci.
0

Discussions similaires

Chemin Logo du site de la Cité de l'espace
Keiios -
blux -

11 réponses
Colis en cours de transport vers votre site de livraison ?
Ninan_5568 -
senda -

8 réponses
'Votre colis est dans le site de livraison qui dessert votre adresse' que faire
relakztek82 -
Unemeuf -

25 réponses
[PIX] Commencer chaque poème sur une nouvelle page
ETHAN -
Willzac -

19 réponses