Partage
  • Partager sur Facebook
  • Partager sur Twitter

Inserer un Liseret / cours numéro 3

inserer un liseret CV

Sujet résolu
16 novembre 2017 à 23:23:52

Bonjour a tous,

Je viens demander votre aide concernant l'insertion d'un liseret, j'ai du faire a peu près 1000 manipulations mais rien n'y fait.

J'ai aussi suivi certains forum, mais c'est le trous noir.

Je ne sais pas ce qui va pas avec mon code HTML ou CSS.

J'ai essayé de mettre des DIV ensuite des SECTIONS.

Pouvez-vous m'éclairer s'il vous plaît ?

merci

<!DOCTYPE html>

<html>
	<body>
	    	
				<head>
		 	    <meta charset="utf-8" />

		        <link rel="stylesheet" href="cv.css" />

		        <title>ELAYACHE FAROUK</title>
		       </head>
		  <div class="liseret"></div>
		    <header>
		  
		       		<a href="image/farouk.jpg"><img src="image/farouk_mini.jpg" class="float" alt="ma photo" title="Cliquez ici pour agrandir"/>
		       		</a></div>
		       		<h2> ELAYACHE FAROUK </h2>
		        	<h2> Apprenti Developpeur chez Openclassrooms</h2>
		        
	    	</header>
	    	
	    	<div id="conteneur">
	    		<section>
	    		
		        
		        	<h2>MON EXPERIENCE</h2>
			        <h4> Juillet 2017 : Assistant ressource humaine à WALL STREET ENGLISH (formation en Anglais) La Défense 92800 Puteaux </h4>
			        <ul>
			        <li>Rédaction contrat de travail et avenant </li>
					<li>Enregistrement des éléments variables de paie pour prestataire externe </li>
					<li>Gestion des acomptes </li>
					<li>Gestion des absences et congés </li>
					<li>Commande ticket restaurant </li>
					<li>Gestion de Mutuelle.</li>
					</ul></br>
				</section>
				
				<section>
				
					<h2> MES COMPETENCES FICTIVES</h2>
					<ul>
					<li>Logiciel, intranet et CRM: EXCEL, WORD, AS400, ASA, GOLMINE (gestion de contact)</li>
					<li>Hermès contact, Interface coyote, Alice 2000, ATAL, Easy Vista IT Platform, Lotus Note</li>
					<li>ADP paie, Chronos (gestion du temps)</li>
					<li>Initiation OPCA ( formation personnelle FAFTT )</li>

				</ul>
				
			</section>
			<section>
				
				
				<h2> MA FORMATION </h2>
				<ul>
					<li>2007/2008: Etudiant en licence science de l’éducation (Université Paris 8 Saint-Denis 93200)</li>
					<li>2007 : Obtention  BTS Management des unités commerciales (Saint-Denis 93200)</li>
					<li>2005 : Obtention du baccalauréat technologique option mercatique (Lycée Polyvalent Georges Pompidou 92390 Villeneuve la garenne)</li>
					</ul>
				
						
			</section>
					
			
    </body>

</html>

et le CSS

@font-face {
    font-family: 'open_sansregular';
    src: url('OpenSans-Regular-webfont.eot');
    src: url('OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('OpenSans-Regular-webfont.woff2') format('woff2'),
         url('OpenSans-Regular-webfont.woff') format('woff'),
         url('OpenSans-Regular-webfont.ttf') format('truetype'),
         url('OpenSans-Regular-webfont.svg#open_sansregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
html body
{
    font-family: 'open_sansregular','verdana','trebuchet';
    background-color: #DCDDDE;
    font-size: 1em;
    width: 98%;
    
}
header
{
text-align: center;
width: 100%;
height: 100%;
}
.float
{
    float: right;
    border: 3px black solid;
}
#conteneur
{
    margin: 10%;
    display:flex;
    justify-content: space-between;
    
}
   
#liseret
{
    
    width: 003%;
    height: 100%;
    background-color: navy;
}
section
{
    display: inline-block;
    width:040%;
    margin: 03%;
}

html
{
    height: 100%;

}
html, #liseret, body
{
    display: flex;
    flex-direction: column;
    height: 100%;
}




  • Partager sur Facebook
  • Partager sur Twitter
17 novembre 2017 à 3:27:37

Bonsoir.

Pour commencer, ta balise <body> n'est pas placée au bonne endroit. je te laisse chercher où la mettre, c'est assez simple.

Ensuite, pour ton soucis, le problème est que tu donne une class à la <div> du liseré, donc dans le CSS, il faut l'appeler avec .liseret et non pas #liseret. (Le # s'utilise avec une id).

N'hésite pas à revenir par là si tu restes bloqué malgré ça.

-
Edité par Lokda 17 novembre 2017 à 3:34:27

  • Partager sur Facebook
  • Partager sur Twitter
17 novembre 2017 à 7:16:08

'lut,

C'est un truc comme ça que tu voudrais ? : 

Ne tiens pas compte des font typo, je ne les ai pas récupérées

J'ne veux pas avoir de problème avec la police

-
Edité par Mon nom est God ; phil God 17 novembre 2017 à 7:18:18

  • Partager sur Facebook
  • Partager sur Twitter
J'échange des connaissances. Si je les donnais, je n'en aurais plus
17 novembre 2017 à 10:50:23

Bonjour,

Tout d'abord merci a vous deux, Lokda j'ai bien rectifié ma balise Body, j'ai aussi indiqué le ".liseret", mais le souci persiste.

Mon nom est God ; phil God: en faites c'est un liseret qui prend toute la page de gauche ( cours HTML /CSS exo numéro 3) , j'ai bien l'èlèment référence qui s'affiche mais pas de liseret avec background.

Merci encore !

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<link rel="stylesheet" href="cv.css" />
		<title>ELAYACHE FAROUK</title>
	</head>
	<body>    
		       
		  <div class="liseret">reference</div>
		    <header>
		  
		       		<a href="image/farouk.jpg"><img src="image/farouk_mini.jpg" class="float" alt="ma photo" title="Cliquez ici pour agrandir"/>
		       		</a></div>
		       		<h2> ELAYACHE FAROUK </h2>
		        	<h2> Apprenti Developpeur chez Openclassrooms</h2>
		        
	    	</header>
	    	
	    	<div id="conteneur">
	    		<section>
	    		
		        
		        	<h2>MON EXPERIENCE</h2>
			        <h4> Juillet 2017 : Assistant ressource humaine à WALL STREET ENGLISH (formation en Anglais) La Défense 92800 Puteaux </h4>
			        <ul>
			        <li>Rédaction contrat de travail et avenant </li>
					<li>Enregistrement des éléments variables de paie pour prestataire externe </li>
					<li>Gestion des acomptes </li>
					<li>Gestion des absences et congés </li>
					<li>Commande ticket restaurant </li>
					<li>Gestion de Mutuelle.</li>
					</ul></br>
				</section>
				
				<section>
				
					<h2> MES COMPETENCES FICTIVES</h2>
					<ul>
					<li>Logiciel, intranet et CRM: EXCEL, WORD, AS400, ASA, GOLMINE (gestion de contact)</li>
					<li>Hermès contact, Interface coyote, Alice 2000, ATAL, Easy Vista IT Platform, Lotus Note</li>
					<li>ADP paie, Chronos (gestion du temps)</li>
					<li>Initiation OPCA ( formation personnelle FAFTT )</li>

				</ul>
				
				</section>
				<section>
				
				
				<h2> MA FORMATION </h2>
				<ul>
					<li>2007/2008: Etudiant en licence science de l’éducation (Université Paris 8 Saint-Denis 93200)</li>
					<li>2007 : Obtention  BTS Management des unités commerciales (Saint-Denis 93200)</li>
					<li>2005 : Obtention du baccalauréat technologique option mercatique (Lycée Polyvalent Georges Pompidou 92390 Villeneuve la garenne)</li>
					</ul>
				
						
				</section>
					
			</div>
    </body>

</html>
@font-face {
    font-family: 'open_sansregular';
    src: url('OpenSans-Regular-webfont.eot');
    src: url('OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('OpenSans-Regular-webfont.woff2') format('woff2'),
         url('OpenSans-Regular-webfont.woff') format('woff'),
         url('OpenSans-Regular-webfont.ttf') format('truetype'),
         url('OpenSans-Regular-webfont.svg#open_sansregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
html body
{
    font-family: 'open_sansregular','verdana','trebuchet';
    background-color: #DCDDDE;
    font-size: 1em;
    width: :98%;

    
}
header
{
text-align: center;
width: 100%;
height: 100%;
}
.float
{
    float: right;
    border: 3px black solid;
}
#conteneur
{
    margin: 10%;
    display:flex;
    justify-content: space-between;
    
}
   
.liseret
{
    float: left;
    width: 003%;
    height: 100%;
    background-color: #DCDDDE;
    margin-left: 0px;
}
section
{
    display: inline-block;
    width:040%;
    margin: 03%;
}

html
{
    height: 100%;

}
html, #liseret, body
{
    display: flex;
    flex-direction: column;
    height: 100%;
}




  • Partager sur Facebook
  • Partager sur Twitter
17 novembre 2017 à 11:04:29

Salut,

Première chose, bien vérifier son code HTML. Ici je vois notamment qu'à la ligne 14 tu fermes une div que tu n'as pas ouverte (probablement une coquille qui reste suite à un test). Et à la ligne 33, tu utilises la balise </br> qui n'existe tout simplement pas, tu voulais utiliser <br /> je pense. Au passage, les espacements doivent se gérer via des margins et des paddings dans le CSS et non à l'aide de <br />.

En ce qui concerne ton problème, tu n'es pas si mal parti que tu sembles le pense. Tu as juste tendance à utiliser le display:flex sur les mauvais éléments. Relis bien cette partie du cours et reprend ton code ensuite, tu y verras plus clair.

  • Partager sur Facebook
  • Partager sur Twitter
Je ne réponds pas aux messages privés.
17 novembre 2017 à 13:46:20

En plus des différentes erreurs qui ont été citées, vérifies bien la couleur de ton liseré. Si il est de la même couleur que le fond de ta page, tu ne risques pas de le voir apparaître ;)

(En passant tu as laissé encore un #liseret).

  • Partager sur Facebook
  • Partager sur Twitter
17 novembre 2017 à 15:36:36

Très bien merci Mewen,

J'ai regarder un peu les cours mais je reste pour le moment bloquer sur cet problématique.

Pouvez-vous me donner une piste ?

J'ai remanier mon CSS, sans trop de succès:(

merci encore

<head>
		<meta charset="utf-8" />
		<link rel="stylesheet" href="cv.css" />
		<title>ELAYACHE FAROUK</title>
	</head>
	<body>    
		       
		<div class="liseret">reference</div>  
		    <header>
		  
		       		<a href="image/farouk.jpg"><img src="image/farouk_mini.jpg" class="float" alt="ma photo" title="Cliquez ici pour agrandir"/>
		       		</a>
		       		<h2> ELAYACHE FAROUK </h2>
		        	<h2> Apprenti Developpeur chez Openclassrooms</h2>
		        
	    	</header>
	    	
	    	<div id="conteneur">
	    		<section>
	    		
		        
		        	<h2>MON EXPERIENCE</h2>
			        <h4> Juillet 2017 : Assistant ressource humaine à WALL STREET ENGLISH (formation en Anglais) La Défense 92800 Puteaux </h4>
			        <ul>
			        <li>Rédaction contrat de travail et avenant </li>
					<li>Enregistrement des éléments variables de paie pour prestataire externe </li>
					<li>Gestion des acomptes </li>
					<li>Gestion des absences et congés </li>
					<li>Commande ticket restaurant </li>
					<li>Gestion de Mutuelle.</li>
					</ul><br/>
				</section>
				
				<section>
				
					<h2> MES COMPETENCES FICTIVES</h2>
					<ul>
					<li>Logiciel, intranet et CRM: EXCEL, WORD, AS400, ASA, GOLMINE (gestion de contact)</li>
					<li>Hermès contact, Interface coyote, Alice 2000, ATAL, Easy Vista IT Platform, Lotus Note</li>
					<li>ADP paie, Chronos (gestion du temps)</li>
					<li>Initiation OPCA ( formation personnelle FAFTT )</li>

				</ul>
				
				</section>
				<section>
				
				
				<h2> MA FORMATION </h2>
				<ul>
					<li>2007/2008: Etudiant en licence science de l’éducation (Université Paris 8 Saint-Denis 93200)</li>
					<li>2007 : Obtention  BTS Management des unités commerciales (Saint-Denis 93200)</li>
					<li>2005 : Obtention du baccalauréat technologique option mercatique (Lycée Polyvalent Georges Pompidou 92390 Villeneuve la garenne)</li>
					</ul>
				
						
				</section>
					
			</div>
    </body>

</html>
@font-face {
    font-family: 'open_sansregular';
    src: url('OpenSans-Regular-webfont.eot');
    src: url('OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('OpenSans-Regular-webfont.woff2') format('woff2'),
         url('OpenSans-Regular-webfont.woff') format('woff'),
         url('OpenSans-Regular-webfont.ttf') format('truetype'),
         url('OpenSans-Regular-webfont.svg#open_sansregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
body
{
    font-family: 'open_sansregular','verdana','trebuchet';
    background-color: #DCDDDE;
    font-size: 1em;
    width: :75%; 
    float: right;  
}
header
{
text-align: center;
width: 100%;
height: 60%;

}
.float
{
    float: right;
    border: 3px black solid;


}
#conteneur
{
    margin: 150px;
    display: flex;
    justify-content: space-between;
    text-align: justify;
    height: 400px;
    margin-left: 200px;
    width: 75%;
    

    
}
section
{
   
    width:030%;
    margin: 05%;
}
h2
{
    text-align: center;
}
.liseret
{
    height: 0px;
    background-color: #bdc5ff;
    width: 25%;
    float: left;
}




  • Partager sur Facebook
  • Partager sur Twitter
17 novembre 2017 à 23:01:56

.liseret
{
    height: 0px;
    background-color: #bdc5ff;
    width: 25%;
    float: left;
}

Si la taille, dans un sens ou dans l'autre, de quelque chose est de 0 pixel, forcément on ne le voit pas.

  • Partager sur Facebook
  • Partager sur Twitter
17 novembre 2017 à 23:34:37

Salut,

Un border-left sur body, ça marche très bien aussi.

  • Partager sur Facebook
  • Partager sur Twitter

Il n'y a pas de mauvais navigateur, il n'y a que du mauvais code !

18 novembre 2017 à 6:05:04

Regarde sur code pen j'ai mis ton code modifié par le mien : https://codepen.io/philoo91/pen/jaaRgo

Avec bootstrap c'est quand même plus facile.

Surtout pour le responsive. Et en plus cela t'allège ton propre css de façon magistrale

Il faut que tu étudie la sémantique c'est le plus fondamentale à l'élaboration du contenu d'une page:

sémantique = l'ordonencement des éléments les un dans les autres.

Une mauvaise sémantique = grosses difficultés pour mettre correctement le css

Le CSS : 

@font-face {
    font-family: 'open_sansregular';
    src: url('OpenSans-Regular-webfont.eot');
    src: url('OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('OpenSans-Regular-webfont.woff2') format('woff2'),
         url('OpenSans-Regular-webfont.woff') format('woff'),
         url('OpenSans-Regular-webfont.ttf') format('truetype'),
         url('OpenSans-Regular-webfont.svg#open_sansregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
html body
{
    font-family: 'open_sansregular','verdana','trebuchet';
    background-color: #DCDDDE;
    font-size: 1em;
    padding: 5px;
    height: 100%;
}
header
{
    text-align: center;
    border: 2px solid navy;
    margin-bottom: 5px;
}

main
{
   border: 2px solid green;
   height: 98vh;
   margin:0px;
   padding: 5px !important; 
}
    
aside
{
    border: 2px solid black;
    text-align:center;
    height: 98vh;
}
section
{
    border: 2px solid pink;
    /* padding: 10px; */
    height: 400px;
}

Le Html : 

<!DOCTYPE html>

<html><head>

<meta charset="utf-8">

<meta name="viewport" content="width=device-width, initial-scale=1">

<title>ELAYACHE FAROUK</title>

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<link rel="stylesheet" href="css/styles.css">

   </head>

    <body class="container-fluid">  

<div class="row">

<aside class="col-sm-2" >

<p>

Liseré

</p>

</aside>

<main class="col-sm-10" >

<header class="container-fluid">

<div class="col-md-10">

<h2> ELAYACHE FAROUK </h2>

<h2> Apprenti Developpeur chez Openclassrooms</h2>

</div>

<a href="image/farouk.jpg" class="col-md-2">

<img src="image/farouk_mini.jpg"  alt="ma photo" title="Cliquez ici pour agrandir">

</a>

</header>

<div class="row center-block">

<section class="col-md-4">

<h2>MON EXPERIENCE</h2>

<h4> Juillet 2017 : Assistant ressource humaine à WALL STREET ENGLISH (formation en Anglais) La Défense 92800 Puteaux </h4>

<ul>

<li>Rédaction contrat de travail et avenant </li>

<li>Enregistrement des éléments variables de paie pour prestataire externe </li>

<li>Gestion des acomptes </li>

<li>Gestion des absences et congés </li>

<li>Commande ticket restaurant </li>

<li>Gestion de Mutuelle.</li>

</ul>

</section>

<section class="col-md-4"> 

<h2> MES COMPETENCES FICTIVES</h2>

<ul>

<li>Logiciel, intranet et CRM: EXCEL, WORD, AS400, ASA, GOLMINE (gestion de contact)</li>

<li>Hermès contact, Interface coyote, Alice 2000, ATAL, Easy Vista IT Platform, Lotus Note</li>

<li>ADP paie, Chronos (gestion du temps)</li>

<li>Initiation OPCA ( formation personnelle FAFTT )</li>

</ul> 

</section>

<section class="col-md-4">

<h2> MA FORMATION </h2>

<ul>

<li>2007/2008: Etudiant en licence science de l’éducation (Université Paris 8 Saint-Denis 93200)</li>

<li>2007 : Obtention  BTS Management des unités commerciales (Saint-Denis 93200)</li>

<li>2005 : Obtention du baccalauréat technologique option mercatique (Lycée Polyvalent Georges Pompidou 92390 Villeneuve la garenne)</li>

</ul>

</section>

</div>

</main>

</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js">    

</body>

</html>
  • Partager sur Facebook
  • Partager sur Twitter
J'échange des connaissances. Si je les donnais, je n'en aurais plus
18 novembre 2017 à 14:10:03

Franchement merci a tous, je n'ai pas vu la réponse mais j'ai trouvé moi même en renseignement la hauteur !

merci comme quoi il faut persévérer !

je met le sujet en résolu, a bientôt

  • Partager sur Facebook
  • Partager sur Twitter
20 novembre 2017 à 13:23:47

Mon nom est God ; phil God a écrit:

Regarde sur code pen j'ai mis ton code modifié par le mien : https://codepen.io/philoo91/pen/jaaRgo

Avec bootstrap c'est quand même plus facile.

Surtout pour le responsive. Et en plus cela t'allège ton propre css de façon magistrale

Il faut que tu étudie la sémantique c'est le plus fondamentale à l'élaboration du contenu d'une page:

sémantique = l'ordonencement des éléments les un dans les autres.

Une mauvaise sémantique = grosses difficultés pour mettre correctement le css

Le CSS : 

@font-face {
    font-family: 'open_sansregular';
    src: url('OpenSans-Regular-webfont.eot');
    src: url('OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('OpenSans-Regular-webfont.woff2') format('woff2'),
         url('OpenSans-Regular-webfont.woff') format('woff'),
         url('OpenSans-Regular-webfont.ttf') format('truetype'),
         url('OpenSans-Regular-webfont.svg#open_sansregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
html body
{
    font-family: 'open_sansregular','verdana','trebuchet';
    background-color: #DCDDDE;
    font-size: 1em;
    padding: 5px;
    height: 100%;
}
header
{
    text-align: center;
    border: 2px solid navy;
    margin-bottom: 5px;
}

main
{
   border: 2px solid green;
   height: 98vh;
   margin:0px;
   padding: 5px !important; 
}
    
aside
{
    border: 2px solid black;
    text-align:center;
    height: 98vh;
}
section
{
    border: 2px solid pink;
    /* padding: 10px; */
    height: 400px;
}

Le Html : 

<!DOCTYPE html>

<html><head>

<meta charset="utf-8">

<meta name="viewport" content="width=device-width, initial-scale=1">

<title>ELAYACHE FAROUK</title>

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<link rel="stylesheet" href="css/styles.css">

   </head>

    <body class="container-fluid">  

<div class="row">

<aside class="col-sm-2" >

<p>

Liseré

</p>

</aside>

<main class="col-sm-10" >

<header class="container-fluid">

<div class="col-md-10">

<h2> ELAYACHE FAROUK </h2>

<h2> Apprenti Developpeur chez Openclassrooms</h2>

</div>

<a href="image/farouk.jpg" class="col-md-2">

<img src="image/farouk_mini.jpg"  alt="ma photo" title="Cliquez ici pour agrandir">

</a>

</header>

<div class="row center-block">

<section class="col-md-4">

<h2>MON EXPERIENCE</h2>

<h4> Juillet 2017 : Assistant ressource humaine à WALL STREET ENGLISH (formation en Anglais) La Défense 92800 Puteaux </h4>

<ul>

<li>Rédaction contrat de travail et avenant </li>

<li>Enregistrement des éléments variables de paie pour prestataire externe </li>

<li>Gestion des acomptes </li>

<li>Gestion des absences et congés </li>

<li>Commande ticket restaurant </li>

<li>Gestion de Mutuelle.</li>

</ul>

</section>

<section class="col-md-4"> 

<h2> MES COMPETENCES FICTIVES</h2>

<ul>

<li>Logiciel, intranet et CRM: EXCEL, WORD, AS400, ASA, GOLMINE (gestion de contact)</li>

<li>Hermès contact, Interface coyote, Alice 2000, ATAL, Easy Vista IT Platform, Lotus Note</li>

<li>ADP paie, Chronos (gestion du temps)</li>

<li>Initiation OPCA ( formation personnelle FAFTT )</li>

</ul> 

</section>

<section class="col-md-4">

<h2> MA FORMATION </h2>

<ul>

<li>2007/2008: Etudiant en licence science de l’éducation (Université Paris 8 Saint-Denis 93200)</li>

<li>2007 : Obtention  BTS Management des unités commerciales (Saint-Denis 93200)</li>

<li>2005 : Obtention du baccalauréat technologique option mercatique (Lycée Polyvalent Georges Pompidou 92390 Villeneuve la garenne)</li>

</ul>

</section>

</div>

</main>

</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js">    

</body>

</html>
C'est certain mais ça dépasse le contenu du cours que l'auteur du sujet est en train de suivre. Ça vient plus tard Bootstrap.

  • Partager sur Facebook
  • Partager sur Twitter
2 octobre 2019 à 12:47:45

Bonjour , j'ai mis des sections dans mon html mais ça ne fonctionne pas pouvez vous m'aider s'il vous plait.

Merci par avance. 

Voici mon html 

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
         <link rel="stylesheet" href="style.css" />
        <title>cv</title>
    </head>

    <p>
            <img src="ordinateur.jpg"> 
                </p>          
    <body>
        <div id="corps de page">
  <h3> BOUANANI Sonia
  </h3>
        <h1> Formatrice Numérique</h1>

        <div id="liseret">
            <svg width="100" height="800">
                <defs>
                        <linearGradient id="rouge-blanc" x1="0%" y1="0%" x2="100%" y2="100%">
                        <stop offset="0%" style="stop-color:purple; stop-opacity:1"/>
                        <stop offset="100%" style="stop-color:#FFFFFF; stop-opacity:1"/>
                    </linearGradient>
                </defs>
                <rect x="2" y="10" width="100" height="800" style=" fill:url(#rouge-blanc); " />
            </svg>
        </div>
        </div id="liseret">
<div class="conteneur">
    <div class ="element">
        <h2>Mes expériences </h2>
<ul>
    <li> Avril 2017 À Décembre 2018 Formatrice à CRIF Centre de Formation et Conseil - Besançon
Remise à niveau en maths, français, bureautique, culture générale 
Animation de modules de français langue étrangère
Animation de modules en remise à niveau avec une pédagogie adaptée 
Remise à niveau demandeurs d’emploi de niveau IV
   </li> 
    <li> Décembre 2017 Conseillère en insertion stage à l’université de Franche-Comté - Service orientation stage emploi ‘OSE) – Besançon

Amélioration des outils de TRE (CV, LM)
Participation aux réunions d’équipe, d’ingénierie, et de partenariats Animation d’atelier de TRE
Participation aux jobs dating et à des simulations d’entretien

 </li>
</ul>
</div>

<div class ="element">
    <h2> Mes compétences </h2>

<ul>
    <li>Ingénierie pédagogique :

Définir les méthodes et outils pédagogiques d’une formation Concevoir des modules de formation
Actualiser des outils de formation/pédagogiques Concevoir des outils de formation numérique/pédagogiques 
Présenter et promouvoir une formation
Mettre en place des actions correctives et préventives
Formation aux outils digitaux (Google slide, Google keep, Google sheet, Google Forms)

   </li> <br>
    <li> Accompagnement :

Accueillir les personnes et cerner leurs demandes et besoins Encadrer les stagiaires dans leurs missions
Corriger des évaluations (exercices, travaux pratiques, examens)
Évaluer le travail d’un stagiaire à l’entrée, en cours et à la sortie du dispositif
   </li> <br>
    <li>  Animation:

Animer des formations collectives et individuelles

   </li>
</ul>
</div>
<div class="element">
    <h2> Mes formations </h2>
        <ul>

    <li>2019 Titre de Formatrice professionnelle d’adultes AFPA -Besançon</li> <br>
    <li>2011 Licence de psychologie Université de Franche-Comté-Besançon   </li> <br>
    <li>2006 Brevet de technicien agricole service aux personnes Maison Familiale et Rurale- Morre    </li>
</ul>
</div>
</div>
    </body>
</html>
  • Partager sur Facebook
  • Partager sur Twitter
2 octobre 2019 à 13:05:04

Bonjour,

Déterrage

Citation des règles générales du forum :

Avant de poster un message, vérifiez la date du sujet dans lequel vous comptiez intervenir.

Si le dernier message sur le sujet date de plus de deux mois, mieux vaut ne pas répondre.
En effet, le déterrage d'un sujet nuit au bon fonctionnement du forum, et l'informatique pouvant grandement changer en quelques mois il n'est donc que rarement pertinent de déterrer un vieux sujet.

Au lieu de déterrer un sujet il est préférable :

  • soit de contacter directement le membre voulu par messagerie privée en cliquant sur son pseudonyme pour accéder à sa page profil, puis sur le lien "Ecrire un message"
  • soit de créer un nouveau sujet décrivant votre propre contexte
  • ne pas répondre à un déterrage et le signaler à la modération

Je ferme ce sujet. En cas de désaccord, me contacter par MP.

  • Partager sur Facebook
  • Partager sur Twitter

Pas d'aide concernant le code par MP, le forum est là pour ça :)