TP04 CSS
This commit is contained in:
parent
e032e57920
commit
02a55cc3e3
93
HTML/TP04/Exercice1.css
Normal file
93
HTML/TP04/Exercice1.css
Normal file
@ -0,0 +1,93 @@
|
||||
body {
|
||||
display: grid;
|
||||
grid-template-columns: 2fr 1fr;
|
||||
padding: 0% 15% 0% 15%;
|
||||
}
|
||||
|
||||
p {
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
}
|
||||
|
||||
a {
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
color: #08c;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
header {
|
||||
grid-column: 1 / span 2;
|
||||
}
|
||||
|
||||
nav {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.accueil {
|
||||
float: right;
|
||||
}
|
||||
|
||||
section {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
grid-template-rows: .1fr 1fr 1fr;
|
||||
}
|
||||
|
||||
.informaticiens {
|
||||
grid-column: 1 / span 2;
|
||||
}
|
||||
|
||||
nav>ul>li {
|
||||
display: inline-block;
|
||||
padding: 10px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
article {
|
||||
display: inline-block;
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 2fr;
|
||||
grid-template-rows: 1fr 1fr 1fr;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
article>h3 {
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
}
|
||||
|
||||
article>img {
|
||||
width: 160px;
|
||||
grid-row: 1 / span 3;
|
||||
grid-column: 2;
|
||||
border-style: solid;
|
||||
border-width: 5px 15px 20px 5px;
|
||||
border-color: #EFEFEF;
|
||||
box-shadow: 10px 8px 5px #555;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
nav>ul>li>a {
|
||||
text-decoration: dashed;
|
||||
text-decoration-line: underline;
|
||||
}
|
||||
|
||||
aside>p>em {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
aside>p>em:nth-child(1) {
|
||||
margin-right: 15px;
|
||||
color: #08c;
|
||||
}
|
||||
|
||||
footer {
|
||||
margin-top: 50px;
|
||||
grid-column: 1 / span 2;
|
||||
}
|
||||
|
||||
footer>p {
|
||||
display: inline;
|
||||
}
|
||||
82
HTML/TP04/Exercice1.html
Normal file
82
HTML/TP04/Exercice1.html
Normal file
@ -0,0 +1,82 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="fr">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="initial-scale=1,witdh=device-width">
|
||||
<title>TP mise en page avec le css</title>
|
||||
<link rel='stylesheet' type='text/css' href='Exercice1.css'>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<h2>Mon Panthéon</h2>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="#">Informaticiens</a></li>
|
||||
<li><a href="#">Mathématiciens</a></li>
|
||||
<li><a href="#">Sportifs</a></li>
|
||||
<li><a href="#">Musiciens</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
<section>
|
||||
<h2 class="informaticiens">Les informaticiens</h2>
|
||||
<article>
|
||||
<img alt="Ritchie" src="http://upload.wikimedia.org/wikipedia/commons/e/e6/Dennis_Ritchie.jpg">
|
||||
<h3>Dennis <br>Ritchie</h3>
|
||||
<p><small>9 septembre 1941 - 12 octobre 2011</small></p><p>Nationalité : américaine</p>
|
||||
</article>
|
||||
<article>
|
||||
<img alt="linus torvalds" src="http://upload.wikimedia.org/wikipedia/commons/7/71/Linus_Torvalds_cropped.jpeg">
|
||||
<h3>Linus <br>Torvalds</h3>
|
||||
<p><small>28 décembre 1969 - </small></p>
|
||||
<p>Nationalité : finlandaise</p>
|
||||
</article>
|
||||
<article>
|
||||
<img alt="Pascal" src="http://upload.wikimedia.org/wikipedia/commons/7/79/Blaise_pascal.jpg">
|
||||
<h3>Blaise <br>Pascal</h3>
|
||||
<p><small>19 juin 1623 - 19 août 1662</small></p>
|
||||
<p>Nationalité : française</p>
|
||||
</article>
|
||||
<article>
|
||||
<img alt="turing" src="https://upload.wikimedia.org/wikipedia/commons/a/a1/Alan_Turing_Aged_16.jpg">
|
||||
<h3>Alan <br>Turing</h3>
|
||||
<p><small>23 juin 1912 - 7 juin 1954</small></p>
|
||||
<p>Nationalité : britannique</p>
|
||||
</article>
|
||||
</section>
|
||||
<aside>
|
||||
<p>
|
||||
<em>>></em><em>Dennis MacAlistair Ritchie</em>, né le 9 septembre 1941 à Bronxville dans
|
||||
l'État de New York et trouvé mort le 12 octobre 20111 à Berkeley Heights dans le New Jersey, est
|
||||
un des pionniers de l'informatique moderne, inventeur du langage C et
|
||||
codéveloppeur de Unix. Il est parfois désigné par dmr, son adresse électronique aux Laboratoires Bell.
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<em>>></em><em>Linus Benedict Torvalds</em>, né le 28 décembre 1969 à Helsinki en Finlande, est un informaticien
|
||||
américano-finlandais1. Il est connu pour avoir créé en 1991 le noyau Linux
|
||||
dont il continue à diriger le développement. Il en est considéré comme le « dictateur bienveillant ».
|
||||
</p>
|
||||
<p>
|
||||
<em>>></em><em>Blaise Pascal</em>, né le 19 juin 1623 à Clairmont (aujourd'hui Clermont-Ferrand) en
|
||||
Auvergne et mort le 19 août 1662 à Paris, est un mathématicien, physicien, inventeur, philosophe,
|
||||
moraliste et théologien français. Il invente, à 19 ans, la calculatrice mécanique.
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<em>>></em><em>Alan Mathison Turing </em>est un mathématicien, cryptologue et informaticien britannique. Il
|
||||
est l'auteur de l'article fondateur de la science informatique1 qui
|
||||
allait donner le coup d'envoi à la création des calculateurs universels programmables (ordinateurs). Il
|
||||
y présente sa machine de Turing et les concepts modernes de programmation et de programme.
|
||||
</p>
|
||||
</aside>
|
||||
<footer>
|
||||
<p>
|
||||
<a href="mailto:monnerat@u-pec.fr">Envoyer un mail</a>
|
||||
</p>
|
||||
<p class="accueil">
|
||||
<a href="#">Revenir à la page d'accueil</a>
|
||||
</p>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Reference in New Issue
Block a user