-
Notifications
You must be signed in to change notification settings - Fork 4
/
Copy pathrealisation.php
97 lines (86 loc) · 3.4 KB
/
realisation.php
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
<style>
main img{
width: 100%;
}
h2{
position: sticky;
top:0;
background: var(--bouton_plus);
text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
color: #FFF;
margin:10px;
border-radius: 0 100% 50% 0 / 0 41px 28px 0;
padding: 20px 0 20px 80px;
display: flex;
grid-column: span 3;
}
h2::after{
content:'';
background: #FFF;
margin: 19px 10px 0 10px;
height:2px;
flex:1;
}
main p{
color: #FFF;
margin-left: 80px;
padding: 10px;
}
main>div>div{
display: flex;
flex-wrap: wrap;
margin-left: 80px;
}
main>div>div>*{
margin:10px;
background: #FFF;
padding: 10px;
width: 400px;
border-radius: 10px;
border: 1px solid: #999;
box-sizing: border-box;
}
</style>
<div class="type_projet">
<h2>Sites Portfolios des étudiants</h2>
<p>Chaque année, les étudiants de première année réalisent leur portfolio sous Wordpress. Les étudiants qui se destinent au développement Web sont encouragés à réaliser un site en codant tout eux même.</p>
<div>
<figure>
<a href="https://gabrieltresch.fr" target="_blank">
<img src="img/portfolio_gabriel.png" alt="Gabriel Tresch">
</a>
<figcaption>Réalisé par Tresch Gabriel.<br> En deuxième année.</figcaption>
</figure>
<figure>
<a href="https://gabrieltresch.fr" target="_blank">
<img src="img/portfolio_gabriel.png" alt="Gabriel Tresch">
</a>
<figcaption>Réalisé par Tresch Gabriel.<br> En deuxième année.</figcaption>
</figure>
</div>
</div>
<div class="type_projet">
<h2>Vidéos des étudiants</h2>
<p>Par groupe, les étudiants réalisent des projets vidéos, de la conception scénaristique, jusqu'au montage final et la poste production. Ils réalisent le storyboard, le tournage, l'éclairage, la prise de son, le jeu d'acteur, etc.</p>
<div>
<iframe width="560" height="315" src="https://www.youtube.com/embed/8_PlMOqppH0" frameborder="0" gesture="media" allow="encrypted-media" allowfullscreen></iframe>
<iframe width="560" height="315" src="https://www.youtube.com/embed/4A7WvZxxJLo" frameborder="0" gesture="media" allow="encrypted-media" allowfullscreen></iframe>
<iframe width="560" height="315" src="https://www.youtube.com/embed/KVxB9ufbG98" frameborder="0" gesture="media" allow="encrypted-media" allowfullscreen></iframe>
<iframe width="560" height="315" src="https://www.youtube.com/embed/yN8Z2H4WAxA" frameborder="0" gesture="media" allow="encrypted-media" allowfullscreen></iframe>
<iframe width="560" height="315" src="https://www.youtube.com/embed/-pQV437OLRM" frameborder="0" gesture="media" allow="encrypted-media" allowfullscreen></iframe>
<iframe width="560" height="315" src="https://www.youtube.com/embed/E97mlMd7c00" frameborder="0" gesture="media" allow="encrypted-media" allowfullscreen></iframe>
</div>
</div>
<div class="type_projet">
<h2>Infographies et visuels des étudiants</h2>
<p>La création d'affiche en utilisant des outils comme Indesign et Photoshop permet aux étudiant de participer à différents concours comme les meilleurs affichent pour luter contre le SIDA.</p>
<div>
<div><img src="img/ferrandez_chrono.jpg"></div>
<div><img src="img/affiche_ferrandez.jpg"></div>
<div><img src="img/affiche_cecile.png"></div>
<div><img src="img/affiche_florian.jpg"></div>
<div><img src="img/amicale.png"></div>
<div><img src="img/logo_ehrmann.png"></div>
<div><img src="img/collage_ferrandez.jpg"></div>
</div>
</div>