Syntaxe :
Voyons ici la syntaxe immédiate de ces éléments de balise.
<article> <h1>…</h1> </article>
La structure suit la balise de début. La section précédente suivante contient
balise ou qui forme un sous-titre, donne des informations sémantiques exactes sur le contenu et fournit des informations significatives beaucoup plus riches et plus appropriées. Comme d'autres balises, cette balise d'article prend également en charge les attributs HTML tels que les attributs d'événement et les attributs globaux pour leur classe appropriée.
Exemple de
<article> <h1>Introduction to CSS demo</h1> <p>CSS is a cascading Style Sheet helps to make a web page visually colored</p> </article>
Comment fonctionne la balise d'article en HTML ?
Cette section abordera une simple balise d'article (contenu autonome dans un document) et verra comment elle fonctionne sur une page Web. HTML 5 introduit un nouveau contenu sémantique pour enrichir le contenu des moteurs de recherche. Ils prennent en charge les attributs globaux et d'événement pour le contenu. Le contenu de la balise est considéré comme un document indépendant de l’autre partie du contenu de la page unique. Ils peuvent définir ou démontrer le nom d’un article sur la page, les informations sur l’auteur et la date de publication. Cet
Un document ayant un seul élément article explique le contenu principal du document. Il a un contenu individuel unique, alors que, dans le cas de plusieurs Vous trouverez ci-dessous les exemples d'implémentation de la balise HTML : Exemple utilisant un seul Code : Sortie : Un exemple illustre l'utilisation de l'attribut Code : Le résultat ci-dessous montre aux visiteurs la page Web avec l'adresse du lien. Sortie : Un exemple démontrant comment afficher une date et une heure avec Code : Sortie : Exemple utilisant plusieurs articles. Le code ci-dessous utilise l'élément sémantique Code : Sortie : Nous verrons l' Code : Sortie : Code : Voici un en-tête global qui contient les titres de pages Web de tout document ayant un contenu connexe. Vient ensuite le Sortie : Balise d'article à l'aide de Code : Sortie : Abschließend behandelt dieser Artikel mehrere Anleitungen zur Verwendung auf einer Webseite. Sie sind eine ausgezeichnete Wahl, um ein Dokument (das sie selbst wahrnehmen) oder einen Inhalt auf einer einzelnen Webseite unterzubringen, und sie sind bekanntermaßen ein perfektes semantisches Element unter HTML5. Da es sich um einen eigenständigen Kontext handelt, wurde es in HTML5 verwendet, da moderne Websites begonnen haben, dieses Tag voll auszunutzen, was vom Benutzer beim Posten von Inhalten wie Blogs und Zeitschriften gut belohnt wird. Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!Exemples d'implémentation de balise HTML
Exemple n°1
<!DOCTYPE html>
<html>
<head>
<title>HTML Article Tag demo</title> </head>
<body>
<article>
<h2>python</h2>
<p>Python is a new programming language</p>
</article>
</body>
</html>
Exemple n°2
<!DOCTYPE html>
<head>
<title>Demo of article</title>
</head>
<body>
<article style="width: 200px; border: 1px solid black;
padding: 8px; border-radius: 8px;
margin:6px;">
<article>
<address>
Written by xxxxxx.<br>
refer me at: <br>
https://www.educba.com/ <br>
</address>
</article>
Exemple #3
<!DOCTYPE html>
<head>
<title>Demo of article tag</title>
</head>
<body>
<article style="width: 200px; border: 1px solid black;
padding: 8px; border-radius: 8px; color :green;
margin:6px;">
<article class="blog_post">
<p>My first article post. Stay tuned</p>
<footer>
<p>
Displayed on <time datetime="2019-12-24 20:00"> Dec 23</time> by tutor
</p>
</footer>
</article>
Exemple n°4
pour spécifier l'en-tête le plus significatif dans le contenu HTML.
<style>
.JAN {
margin: 1;
padding: .2rem;
background-color: #D2691E;
font: 2rem 'Fira Sans', sans-serif;
}
.JAN > h1,
.day {
margin: .4rem;
padding: .2rem;
font-size: 1rem;
}
.day {
background: border-box no-repeat
gray;
}
.day > h2,
.day > p {
margin: .2rem;
font-size: 1rem;
}
</style>
<article class="JAN">
<h1>FEDERAL HOLIDAYS IN USA</h1>
<article class="day">
<h2>01 JAN 2020</h2>
<p>NEW YEAR DAY.</p>
<p> martin luther day </p>
</article>
<article class="day">
<h2>18 feb 2020</h2>
<p>Presidents day.</p>
</article>
<article class="day">
<h2>05 May 2020</h2>
<h2>27 May 2020</h2>
<p>mothers day.</p>
<p>memorial day.</p>
</article>
</article>
Exemple #5
<style>
.art {
margin: 5;
padding: .3rem;
background-color: #DC143C;
font: 1rem 'italic', sans-serif;
}
</style>
<article class="art">
<section id="aim">
<p>[Main Objective]</p>
</section>
<section id="main_concept">
<p>[Content text]</p>
</section>
<section id="link page">
<ul>
<li><a href="tt.html">first link page</a></li>
<li><a href="th.html">second link page</a></li>
</ul>
</section>
</article>
Exemple #6
<article>
<header>
<h1>On this page</h1>
<p>Published on 15th DEC 2019</p>
</header>
<p>WELCOME</p>
<p> EXAMPLES TOPIC</p>
<p>ILLUSTRATION</p>
<section>
<h2>Related topics</h2>
<article>
<footer>
<p>published by Mark winston</p>
</footer>
<p>This was a great article</p>
</article>
<article>
<footer>
<p>Posted by: Casey Brock</p>
</footer>
<p>What do you think about the topics with the comments please</p>
</article>
</section>
</article>
Exemple #7
<!DOCTYPE html>
<head>
<title>Demo of article tag</title>
</head>
<main>
<article>
<h1>Cloud computing Basics</h1>
<p>Used for data storage.</p>
<section>
<h2>Basic and syntax part</h2>
<p>With an example.</p>
</section>
<section>
<h2>Types of cloud computing services</h2>
<p>Private , public , hybrid</p>
</section>
</article>
</main>
Fazit