-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathemphase.html
154 lines (140 loc) · 7.46 KB
/
emphase.html
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
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
<!DOCTYPE html>
<html lang="fr-FR">
<head>
<meta charset="utf-8">
<meta name="description" content="Explication des balises emphase, <em>, <strong>, <span>, en html 5, avec des exemples de code et d'utilisation.">
<meta name="keywords" content="em, strong, span, html, formats, attributs, désignation, unités">
<meta name="Robots" content="all">
<meta name="Revisit-After" content="30 days">
<META HTTP-EQUIV="EXPIRES" CONTENT="Fri, 03 Mar 2017 12:00:00 GMT">
<meta name="msapplication-TileImage" content="favicon-144.png">
<meta name="msapplication-TileColor" content="#FFFFFF">
<link rel="apple-touch-icon-precomposed" sizes="57x57" href="images/favicon/apple-touch-icon-57x57.png" />
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="images/favicon/apple-touch-icon-114x114.png" />
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="images/favicon/apple-touch-icon-72x72.png" />
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="images/favicon/apple-touch-icon-144x144.png" />
<link rel="apple-touch-icon-precomposed" sizes="60x60" href="images/favicon/apple-touch-icon-60x60.png" />
<link rel="apple-touch-icon-precomposed" sizes="120x120" href="images/favicon/apple-touch-icon-120x120.png" />
<link rel="apple-touch-icon-precomposed" sizes="76x76" href="images/favicon/apple-touch-icon-76x76.png" />
<link rel="apple-touch-icon-precomposed" sizes="152x152" href="images/favicon/apple-touch-icon-152x152.png" />
<link rel="icon" type="image/png" href="images/favicon/favicon-196x196.png" sizes="196x196" />
<link rel="icon" type="image/png" href="images/favicon/favicon-96x96.png" sizes="96x96" />
<link rel="icon" type="image/png" href="images/favicon/favicon-32x32.png" sizes="32x32" />
<link rel="icon" type="image/png" href="images/favicon/favicon-16x16.png" sizes="16x16" />
<link rel="icon" type="image/png" href="images/favicon/favicon-128.png" sizes="128x128" />
<meta name="application-name" content=" "/>
<meta name="msapplication-TileColor" content="#FFFFFF" />
<meta name="msapplication-TileImage" content="mstile-144x144.png" />
<meta name="msapplication-square70x70logo" content="mstile-70x70.png" />
<meta name="msapplication-square150x150logo" content="mstile-150x150.png" />
<meta name="msapplication-wide310x150logo" content="mstile-310x150.png" />
<meta name="msapplication-square310x310logo" content="mstile-310x310.png" />
<link href="https://fonts.googleapis.com/css?family=Raleway:400,700,800,900" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="css-as/main.css">
<title>Les balises d'emphase html - strong, em, span</title>
</head>
<body>
<header id="header">
<a href="#"><img src="images/Logo-groupe.svg" height="787.5px" width="1000px" alt="logo fond vert et texte HTML"></a>
</header>
<header id="back-nav">
<nav id="nav1">
<ol>
<li><a href="index.html">HTML</a></li>
<li><a href="head.html">HEAD</a></li>
<li><a href="meta.html">META</a></li>
<li><a href="title.html">TITLE</a></li>
<li><a href="body.html">BODY</a></li>
<li><a href="h.html">H1 A H6</a></li>
<li><a href="p.html">P</a></li>
<li><a href="a.html">A</a></li>
<li><a href="section.html">SECTION</a></li>
<li><a href="nav.html">NAV</a></li>
<li><a href="header.html">HEADER</a></li>
<li><a href="footer.html">FOOTER</a></li>
<li><a href="aside.html">ASIDE</a></li>
<li><a href="img.html">IMG</a></li>
<li><a href="ul.html">UL</a></li>
<li><a href="ol.html">OL</a></li>
<li><a href="div.html">DIV</a></li>
<li><a href="video.html">VIDEO</a></li>
<li><a href="emphase.html" class="active" >EMPHASES</a></li>
</ol>
</nav>
<div class="dropdown">
<span>Menu</span>
<div class="dropdown-content">
<nav>
<ol>
<li><a href="index.html">HTML</a></li>
<li><a href="head.html">HEAD</a></li>
<li><a href="meta.html">META</a></li>
<li><a href="title.html">TITLE</a></li>
<li><a href="body.html">BODY</a></li>
<li><a href="h.html">H1 A H6</a></li>
<li><a href="p.html">P</a></li>
<li><a href="a.html">A</a></li>
<li><a href="section.html">SECTION</a></li>
<li><a href="nav.html">NAV</a></li>
<li><a href="header.html">HEADER</a></li>
<li><a href="footer.html">FOOTER</a></li>
<li><a href="aside.html">ASIDE</a></li>
<li><a href="img.html">IMG</a></li>
<li><a href="ul.html">UL</a></li>
<li><a href="ol.html">OL</a></li>
<li><a href="div.html">DIV</a></li>
<li><a href="video.html">VIDEO</a></li>
<li><a href="emphase.html" class="active" >EMPHASES</a></li>
</ol>
</div>
</div>
</nav>
</header>
<section>
<article>
<header>
<h2>Les balises d'emphase html</h2>
</header>
<div id="blanc">
<h3> La balise ‹strong› </h3>
<p> La balise ‹strong› signale une haute importance (à la lecture aussi), et est par défaut affiché en gras.</p>
<h4>Exemple</h4>
<p>‹strong›Texte encadré par la balise strong‹/strong›</p>
<p><strong>Texte encadré par la balise strong</strong></p>
</div>
<div id="gris">
<div id="gris2">
<h3> La balise ‹em› </h3>
<p> La balise ‹em› signale une importance légère, dictée de manière différente. Le navigateur met le texte en italique par défaut. Elle peut être utilisée pour des termes techniques, des mots étrangers, etc...</p>
<h4>Exemple</h4>
<p>Bienvenue sur ‹em›OFP‹/em›, bonne navigation.</p>
<p>Bienvenue sur <em>OFP</em>, bonne navigation.</p>
</div>
</div>
<div id="blanc">
<div>
<h3> La balise ‹span› </h3>
<p> La balise ‹span› permet de donner de l'importance à un mot ou groupe de mots sans avoir d'incident sur son apparence sur le code html.</p>
<h4>Exemple</h4>
<p>Bienvenue sur ‹span style="font-style:italic;"›OFP‹/span›, bonne navigation.</p>
<p>Bienvenue sur <span style="font-style:italic;">OFP</span>, bonne navigation.</p>
</div>
</div>
<div id="gris">
<div id="gris2" id="titre">
<!-- Insérer le résultat ci dessous -->
</div>
<div id="Buttonnext">
<p><a href="html.html">Balise suivante ›</a></p>
</div>
<div id="Buttonbefore">
<p><a href="video.html">‹ Balise précédente</a></p>
</div>
</div>
</article>
</section>
<footer>
<p>Page rédigée et réalisée par <a href="#">Elodie</a>, <a href="#">Gwendal</a>, <a href="#">Anthony</a></p>
</footer>
</body>
</html>