Partage
  • Partager sur Facebook
  • Partager sur Twitter

Questions MOOC HTML/CSS

    2 octobre 2021 à 22:22:42

    Pour coder plus vite tu peux apprendre a utiliser emmet pour html et des raccourcis clavier qui te faciliteront la vie. Certains dupliquent une ligne certains peuvent te permettre de deplacer une ligne ou toute ta sélection dans le code. J'ai utilisé sublime text mais actuellement je suis sur vscode donc je ne peux pas t'en donner car ce ne sont pas les meme raccourcis clavier mais tu peux regarder sur google.
    • Partager sur Facebook
    • Partager sur Twitter
      4 octobre 2021 à 16:35:55

      Merci pour ta réponse zvheer.

      Je rame avec l'installation et les plug-in de emmet.

      Pas sur d'avoir la bonne version de sublime text Pourtant télécharger il y a peu de temps....

      Je ne sais même pas si emmet est installé sur ma version..

      • Partager sur Facebook
      • Partager sur Twitter
        6 octobre 2021 à 22:49:31

        Bonjour / bonsoir

        si ta version est récente en général emmet est deja disponible essaie en ecrivant p*4{bonjour} suivi de la touche tab si sa marche c'est ce que tu as emmet sinon tu fais fait cntrl shift p tu ecris install package tu appuie sur install package ensuite quand le chamo s'affichera tu pourras ecrire emmet et sa installera.

        Je te conseille aussi livereload c'est vraiment tres flemmard mais je trouve pratique.. 

        • Partager sur Facebook
        • Partager sur Twitter
          12 octobre 2021 à 15:14:36 - Message modéré pour le motif suivant : Doublon


            12 octobre 2021 à 15:27:43

            @KimberlyBelrain

            Bonjour, réponse dans votre sujet dédié https://openclassrooms.com/forum/sujet/police-12

            Merci de ne pas créer de doublon.

            • Partager sur Facebook
            • Partager sur Twitter
              1 novembre 2021 à 11:19:01

              bonjour, j'ai un blocage je n'arrive pas a incéré des photo est que vous pouvez m'aide ?

              merci

              • Partager sur Facebook
              • Partager sur Twitter
                30 novembre 2021 à 10:45:08

                Bonjour j'ai un petit problème avec l'exercice css du cv je n'arrive pas a mettre mon image de fond pouvez vous m'aider s'il vous plait?

                 aide pour mon code 

                • Partager sur Facebook
                • Partager sur Twitter
                  2 décembre 2021 à 8:16:06

                  Bonjour, 

                  Il te faut voir avec le background-image :https://developer.mozilla.org/fr/docs/Web/CSS/background-image

                  • Partager sur Facebook
                  • Partager sur Twitter
                    5 décembre 2021 à 18:03:34

                    bonjour j'ai une question une fois un projet livrer comment le client est sensé l'administrer ?exemple je développe un site pour un restaurent mais ensuite forcement le contenu du site va changer avec le temps . quelle outils je peux donner a mon client pour cela ? je sais pas si cest le bon forum pour ca mais on sais jamais merci.
                    • Partager sur Facebook
                    • Partager sur Twitter
                      5 décembre 2021 à 18:13:24

                      Bonjour,

                      >> je sais pas si cest le bon forum pour ca

                      Pas exactement puisque cela ne concerne pas directement le cours HTML/CSS de ce site, tu aurais pu créer ton propre sujet dédié, mais je vais quand même y répondre.

                      Soit tu développes un back-end qui permet la modification des données en basse par le client, soit tu passes par un CMS auquel tu donnes les droits nécessaires pour que le client y modifie ce qu'il doit modifier.

                      -
                      Edité par AbcAbc6 5 décembre 2021 à 18:13:52

                      • Partager sur Facebook
                      • Partager sur Twitter
                        6 décembre 2021 à 19:00:16

                        AbcAbc6 a écrit:

                        Bonjour,

                        >> je sais pas si cest le bon forum pour ca

                        Pas exactement puisque cela ne concerne pas directement le cours HTML/CSS de ce site, tu aurais pu créer ton propre sujet dédié, mais je vais quand même y répondre.

                        Soit tu développes un back-end qui permet la modification des données en basse par le client, soit tu passes par un CMS auquel tu donnes les droits nécessaires pour que le client y modifie ce qu'il doit modifier.

                        -super merci es que tu s'aurais m'orienter vers un tuto pour apprendre a le réaliser 
                        en back end ?

                        Edité par AbcAbc6 hier à 18:13



                        • Partager sur Facebook
                        • Partager sur Twitter
                          6 décembre 2021 à 19:47:22

                          il y a plusieurs langages pour le backend php django avec python... recherche un peu sur google et cherche quelque chose qui ne te découragera pas pour debuter
                          • Partager sur Facebook
                          • Partager sur Twitter
                            6 décembre 2021 à 20:03:18

                            >> -super merci es que tu s'aurais m'orienter vers un tuto pour apprendre a le réaliser en back end ?

                            Tu disposes de tous les cours sur le site à cette adresse https://openclassrooms.com/fr/courses

                            Pour le cours en PHP https://openclassrooms.com/fr/courses/918836-concevez-votre-site-web-avec-php-et-mysql

                            Comme le dit zvheer il est possible de faire le back-end dans différents langages.

                            • Partager sur Facebook
                            • Partager sur Twitter
                              9 décembre 2021 à 7:25:20

                              Bonjour ,j'ai un probleme sur  la cession Insertion des images , ,l'emplacement de l'image devrait elle dans même dossier que le html ?Merci 
                              • Partager sur Facebook
                              • Partager sur Twitter
                                9 décembre 2021 à 10:08:24

                                Bonjour.

                                L'emplacement de l'image peut etre n'importe où dans ton arborescence. L'essentiel étant de mettre le bon chemin vers l'image dans le html.

                                Exemple

                                index.html

                                dossier Css

                                -> index. css

                                dossier Images

                                -> mon image

                                // dans ce cas ci le chemin vers l'image a partir du fichier index.html sera images/monimage.png

                                -
                                Edité par zvheer 9 décembre 2021 à 10:10:23

                                • Partager sur Facebook
                                • Partager sur Twitter
                                  13 décembre 2021 à 0:56:30

                                  bonsoir à tous. lorsque j'essaie d'afficher une image malgré la procédure je tombe sur cela a chaque.
                                  pourriez vous m'aider?
                                  • Partager sur Facebook
                                  • Partager sur Twitter
                                    16 décembre 2021 à 20:11:36

                                    bonjour j'ai un probleme je ne peux pas afficher ma photo a l'aide de notepad++ sur mon site web help pls
                                    • Partager sur Facebook
                                    • Partager sur Twitter
                                      16 décembre 2021 à 22:08:39

                                      Bonsoir,

                                      @totobobo7 notepad++ te sert à écrire du code qui une fois interpréter par le navigateur affichera quelque chose. Ce n'est pas notepad++ qui t'affichera quelque chose.

                                      @totobobo7 et @CharlesJuniorBissielou Quel est le code que vous avez écrit (insérer sur le forum à l'aide du bouton code </>) et la hiérarchie de vos fichiers?

                                      Si vous êtes sur Windows, avez vous affiché les extensions dans l'explorateur de fichier pour voir le nom complet et exacte de votre image.

                                      -
                                      Edité par AbcAbc6 16 décembre 2021 à 22:09:17

                                      • Partager sur Facebook
                                      • Partager sur Twitter
                                        16 décembre 2021 à 23:32:28

                                        .

                                        -
                                        Edité par GODJESSYX 16 décembre 2021 à 23:33:09

                                        • Partager sur Facebook
                                        • Partager sur Twitter
                                          22 décembre 2021 à 20:26:33

                                          oyo971 a écrit:

                                          -
                                          Edité par InèsNasr 22 décembre 2021 à 20:26:55

                                          • Partager sur Facebook
                                          • Partager sur Twitter
                                            5 janvier 2022 à 18:26:56

                                            Bonjour,

                                            Je suis actuellement le MOOC HTML/CSS, j'essaye de mettre en pratique le Flex mais je n'arrive pas à ne déplacer qu'un seul élément sur la gauche.

                                            J'ai fait un CV fictif, tout est centré en colonne mais je voudrai qu'un idem soit à gauche.

                                            J'ai relu le cours plusieurs fois, il me seble faire ce qu'il faut, ais ça ne fonctionne pas...


                                            Pourriez vous m'aider ? je vous joins les codes HTML et CSS. est-il possible de basculer uniquement l'élément "nav" à gauche ?

                                            Merci pour votre aide.

                                            <!DOCTYPE html> 
                                            <html>
                                            
                                            	<Head>
                                            		<meta charset="utf-8"/>
                                            		<link rel="stylesheet" href="CV.css"/>
                                            		<title>CV</title>
                                            	</head>
                                            
                                            	<div id="body">
                                            	<body>
                                            		<header>
                                            		<div class="header">
                                            		<h1> Claire P........ </h1>
                                            			<p> 
                                            				<a href="images/cvgrand.jpeg"><img src="images/cvmini.jpg" alt="photo d'identité" title="cliquer pour agrandir"/> </a>
                                            			</p>
                                            		</div>
                                            		</header>
                                            
                                            		<nav >
                                            		<div class="nav">
                                            				<h3>mes points forts</h3>
                                            					<ul>
                                            						<li>blablabla</li>
                                            						<li>bliblibli</li>
                                            					</ul>
                                            				<h3>mes savoirs faire</h3>
                                            					<ul> 
                                            						<li> blobloblo</li>
                                            						<li>blublublu</li>
                                            					</ul>
                                            			
                                            		</div>
                                            		</nav>
                                            		
                                            
                                            		<section>
                                            		<div class="section">
                                            		<h2>Mon expérience</h2>
                                            		<p>
                                            			<ul>
                                            				<li> kjhfkhgdhdkdtk</li>
                                            				<li> hjfkjyfkjfkjyfykfgjy </li>
                                            				<li> hkgfkhdhkfjkfjhk</li>
                                            			</ul>
                                            		</p>
                                            		<h2>Mes compétences</h2>
                                            		<p>
                                            			<ul>
                                            				<li> jkhfkgfkjf <em>important</em> </li>
                                            				<li> Lecture d'un bilan </li>
                                            				<li> yfyfyufyuffffff</li>
                                            			</ul>
                                            		</p>
                                            		<h2>Ma formation</h2>
                                            		<p>
                                            			<ul>
                                            				<li> BAC+4</li>
                                            				<li> jhjfkfkj </li>
                                            				<li> jhfkyfuf </li>
                                            				<li> Formation sur <a href="https://openclassrooms.com/fr/courses/1603881-apprenez-a-creer-votre-site-web-avec-html5-et-css3/1605763-creez-des-apparences-dynamiques">openclassrooms.com</a></li>
                                            			</ul>
                                            		</p>
                                            		</div>
                                            		</section>
                                            
                                            		<footer>
                                            		<div class="footer">
                                            			<h2>Mes hobbies</h2>
                                            				<ul>
                                            					<li>courses à pieds</li>
                                            					<li>les voyages</li>
                                            					<li>les randonnées</li>
                                            					<li>la gastronomie</li>
                                            				</ul>
                                            		</div>
                                            		</footer>
                                            	</body>
                                            	</div>
                                            </html>
                                            
                                            li
                                            {
                                            	color:royalblue;
                                            	font-size: 1em;
                                            }
                                            
                                            a:visited
                                            {
                                            	color: rgb(222, 244, 95.69);
                                            }
                                            
                                            ul 
                                            {
                                            	list-style-position: inside;
                                            }
                                            
                                            @font-face{
                                            	font-family: 'jakartasignature';
                                            	src: url('jakartasignature.ttf'),
                                            		url('jakartasignature.otf');
                                            
                                            }
                                            
                                            h1
                                            {
                                            	font-size: 2em;
                                            	color: darkblue;
                                            	font-family: 'jakartasignature';
                                            }
                                            
                                            
                                            
                                            h2
                                            {
                                            	color: darkblue;
                                            	font-size: 1.5em;
                                            	font-weight: bold;
                                            	text-decoration: overline;
                                            
                                            }
                                            
                                            h2:hover
                                            {
                                            	color: red;
                                            	text-decoration: underline;
                                            
                                            }
                                            
                                            h3
                                            {
                                            	color:  darkblue;
                                            	font-size: 1,2em;
                                            	font-weight: bold;
                                            	text-decoration: underline;
                                            }
                                            
                                            
                                            em
                                            {
                                            	color: royalblue;
                                            	font-weight: bold;
                                            }
                                            
                                            
                                            *
                                            {
                                            	font-family: Georgia, "Comic Sans MS", Arial, sans-serif;
                                            }
                                            
                                            body
                                            {
                                            	background: rgb(184, 185, 186);
                                            	border : solid darkblue 5px;
                                            	box-shadow: 5px 5px 5px darkblue;
                                            	border-radius: 50px;
                                            	text-align: center;
                                            }
                                            
                                            section
                                            {
                                            	border: solid darkblue 1px;
                                            	
                                            }
                                            
                                            nav
                                            {
                                            	border: solid darkblue 1px;
                                            }
                                            
                                            header
                                            {
                                            	border: solid darkblue 1px;
                                            }
                                            
                                            footer
                                            {
                                            	border: solid darkblue 1px;
                                            	
                                            }
                                            
                                            #body
                                            {
                                            	display: flex;
                                            	flex-direction: column;
                                            	justify-content: flex-start;
                                            	align-items: center;
                                            
                                            }
                                            
                                            .nav:nth-child(2)
                                            {
                                            	display: flex;
                                            	align-self: flex-start;
                                            }
                                            
                                            

                                            -
                                            Edité par ClairePourcelle 6 janvier 2022 à 10:08:13

                                            • Partager sur Facebook
                                            • Partager sur Twitter
                                              5 janvier 2022 à 18:32:00

                                              Bonjour   ClairePourcelle ,

                                              Sans voir votre code difficile de répondre correctement.  align-self peut être??

                                              https://developer.mozilla.org/fr/docs/Web/CSS/align-self

                                              • Partager sur Facebook
                                              • Partager sur Twitter
                                                6 janvier 2022 à 9:05:31 - Message modéré pour le motif suivant : Merci d'utiliser le bouton code du forum pour insérer votre code


                                                  6 janvier 2022 à 10:07:31

                                                  bonjour ClairePourcelle, Merci d'utiliser le bouton code </> du forum pour l'insertion de votre code.

                                                  Utilisez le validateur pour corriger vos erreurs => https://validator.w3.org/#validate_by_input

                                                  Rien entre </head> et <body> tout comme rien entre </body> et </html>, les balises d'affichage doivent être dans le body et pas en dehors.

                                                  On ne place pas une liste dans un paragraphe qui n'accepte que du contenu phrasé.

                                                  D'un point de vue sémantique, le lien de la photo d'identité ne devrait pas être dans un paragraphe, ce n'est pas une portion d'un texte; Vous pouvez utiliser  <figure>  ce qui serrait plus sémantique.

                                                  Pour placer la navigation à droite soit vous la placer avant le header et faite flotter, soit utilisez align-self: flex-end;

                                                  • Partager sur Facebook
                                                  • Partager sur Twitter
                                                    6 janvier 2022 à 15:25:50

                                                    Merci beaucoup pour les corrections et la réponse.

                                                    Cette fois ci mon code est passé au validateur. Il n' a plus d'erreur.

                                                    Cependant, je n'arrive pas à déplacer <nav> avec align-self.

                                                    Tant pis, je vais le faire avec float , j'aurai voulu comprendre mon erreur mais ça fait des heures que je cherche, je ne comprends pas.

                                                    • Partager sur Facebook
                                                    • Partager sur Twitter
                                                      6 janvier 2022 à 16:26:04 - Message modéré pour le motif suivant : Merci d'utiliser le bouton code du forum pour insérer votre code


                                                        6 janvier 2022 à 16:30:35

                                                        Bonsoir, vus votre édit :

                                                        >> est-il possible de basculer uniquement l'élément "nav" à gauche ?

                                                        >> Cependant, je n'arrive pas à déplacer <nav> avec align-self.

                                                                    nav { 
                                                                        border: solid darkblue 1px;
                                                                        align-self: flex-start;
                                                                    }

                                                        Mais une navigation est sensée contenir des liens de navigation pas deux listes. Je ne vois pas de lien dans votre code.

                                                        @MathieuCaulfuty Merci d'utiliser l'outil d'insertion de code du forum, soit le bouton code </> de la barre d'outil.

                                                        Si l'image ne s'affiche pas c'est qu'elle ne s'appelle pas comme vous l'avez indiquée ou que son extension n'est pas celle indiquée ou que l'image ne ce trouve pas dans ce répertoire.

                                                        -
                                                        Edité par AbcAbc6 6 janvier 2022 à 16:35:10

                                                        • Partager sur Facebook
                                                        • Partager sur Twitter
                                                          6 janvier 2022 à 16:39:45

                                                          Merci, sauf que l'image est placé dans le bon sous dossier et je l'ai bien nommé, je ne sais quoi faire.
                                                          <img src="photo_profil.jpg" alt="Photo de profil" />
                                                          • Partager sur Facebook
                                                          • Partager sur Twitter

                                                          Questions MOOC HTML/CSS

                                                          × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
                                                          • Editeur
                                                          • Markdown