Scribd
Importer
477 vues4 pages

CV HTML CSS TP

Ce document présente un CV au format HTML avec des balises et propriétés CSS appropriées. Le CV contient les informations personnelles, l'expérience, la formation, les compétences, les langues et les centres d'intérêt de la personne.

Transféré par

Anass Akera
Copyright
© © All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd
477 vues4 pages

CV HTML CSS TP

Ce document présente un CV au format HTML avec des balises et propriétés CSS appropriées. Le CV contient les informations personnelles, l'expérience, la formation, les compétences, les langues et les centres d'intérêt de la personne.

Transféré par

Anass Akera
Copyright
© © All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd

Objectif : Créer un CV au format HTML en utilisant les balises et propriétés CSS

appropriées.
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>CV de Khadija Tabit</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
background-color: #f4f4f4;
color: #333;
}
.container {
width: 80%;
margin: 0 auto;
padding: 20px;
background-color: #fff;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
header {
text-align: center;
margin-bottom: 20px;
}
header img {
border-radius: 50%;
width: 150px;
height: 150px;
}
h1 {
font-size: 2em;
margin-bottom: 0;
}
h2 {
font-size: 1.5em;
color: #555;
}
.section {
margin-bottom: 20px;
}
.section h2 {
border-bottom: 2px solid #007BFF;
padding-bottom: 5px;
}
.section ul {
list-style-type: none;
padding: 0;
}
.section ul li {
margin-bottom: 10px;
}
.contact-info {
display: flex;
justify-content: space-around;
flex-wrap: wrap;
}
.contact-info div {
margin: 5px 0;
}
.skills ul, .languages ul, .interests ul {
display: flex;
flex-wrap: wrap;
}
.skills ul li, .languages ul li, .interests ul li {
flex: 1 1 45%;
margin: 5px 0;
background-color: #007BFF;
color: #fff;
padding: 10px;
border-radius: 5px;
text-align: center;
}
</style>
</head>
<body>
<div class="container">
<header>
<img src="[Link]" alt="Ma Photo">
<h1>Khadija Tabit</h1>
<div class="contact-info">
<div><a
href="[Link]
<div><a href="[Link]
<div>Casablanca tit mlil Sidi hejjaj wed hessar</div><br>
<div>Étudiant</div><br>
<div>Célibataire</div>
</div>
</header>

<div class="section">
<h2>Expérience Professionnelle</h2>
<ul>
<li><strong>Poste 1</strong> - Vendeuse dans une magazin </li>

</ul>
</div>

<div class="section">
<h2>Formation Académique</h2>
<ul>
<li><strong>Diplôme 1</strong> - Enseignant d'école primaire</li>

</ul>
</div>

<div class="section skills">


<h2>Compétences</h2>
<ul>
<li>Écoute active</li>
<li>Esprit d'équipe</li>
<li>Conseil client</li>
<li>Organisation</li>
<li>Écoute client</li>
<li>Polyvalence</li>
</ul>
</div>

<div class="section languages">


<h2>Langages</h2>
<ul>
<li>Français B2</li>
<li>Anglais B1</li>
<li>Arabe C2</li>
</ul>
</div>

<div class="section interests">


<h2>Centre d'intérêt</h2>
<ul>
<li>Cuisine du monde</li>
<li>Cuisine</li>
<li>Lecture</li>
<li>Musique</li>
</ul>
</div>
</div>
</body>
</html>

Vous aimerez peut-être aussi