Maison > Article > interface Web > Balise de section HTML
L'article suivant donne un aperçu de la balise de la section HTML. HTML
Les balises de début et de fin sont requises pour la balise Section en HTML5, c'est-à-dire
Syntaxe :
Ci-dessous la syntaxe mentionnée :
HTML/XHTML
<body> <section> ... </section> <body>
CSS
section{ --your css code— }
Voici quelques-uns des attributs mentionnés :
Aucun attribut spécifique n'est présent pour être utilisé avec la
Comme toutes les autres balises HTML, la
Voici les attributs globaux :
Aucun attribut d'événement n'est présent pour être utilisé avec la
Vous trouverez ci-dessous les propriétés de formatage du texte CSS :
Vous trouverez ci-dessous les propriétés de la police CSS :
Given below is the CSS Test Shadow Property:
<style> address{ text-shadow: 1px 1px #FF0000; } </style>
Given below are the examples of HTML section Tag:
Code:
<!DOCTYPE html> <html> <head> <title>Section tag</title> </head> <body> <section> <h1>eduCBA: Article 1</h1> <p>Content of Article 1</p> </section> <section> <h1>eduCBA: Article 2</h1> <p>Content of Article 2</p> </section> <section> <h1>eduCBA: Article 3</h1> <p>Content of Article 3</p> </section> </body> </html>
Output:
Nested Section Tag.
The
Code:
<!DOCTYPE html> <html> <head> <title>Section tag</title> </head> <body> <section> <h1>eduCBA: Article 1</h1> <p>Content of Article 1</p> <section> <h1>Subsection</h1> <h1>Subsection</h1> </section> </section> <section> <h1>eduCBA: Article 2</h1> <p>Content of Article 2</p> <section> <h1>Subsection</h1> <h1>Subsection</h1> </section> </section> <section> <h1>eduCBA: Article 3</h1> <p>Content of Article 3</p> <section> <h1>Subsection</h1> <h1>Subsection</h1> </section> </section> </body> </html>
Output:
Code:
<!DOCTYPE html> <html> <head> . . . </head> <body> <header> <h1>HTML Section tag example</h1> </header> <main> <article> An article on HTML Section tag</article> </main> <aside> Body of an article </aside> <footer> <section>Copyright ©2020- EDUCBA.</section> <address> A- 406, Boomerang, Chandivali Farm Road, Yadav Nagar, Chandivali, Powai, Maharashtra, Mumbai - 400072. </address> </footer> </body> </html>
Output:
Code:
<!DOCTYPE> <html> <head> <style> section{ border:1px solid pink; padding:15px; margin:10px; } </style> </head> <body> <h2> List of Articles</h2> <section> <h3>Article 1 heading</h3> <p> Body of article </p> </section> <section> <h3>Article 2 heading</h3> <p> Body of article </p> </section> <section> <h3>Article 3 heading</h3> <p> Body of article </p> </section> </body> </html>
Output:
While creating a
The section should always have a header element (H1 to H6). If a title cannot be given for the section, we can use the
Code:
<!DOCTYPE> <html> <head> <style> section{ border:1px solid pink; padding:15px; margin:10px; } </style> </head> <body> <section id="sectiontag" class="sectionclass"> <h2>HTML Section tag</h2> <p>Random text Random text Random text...</p> </section> <section id="articletag"> <h2>HTML Article tag</h2> <p>Random text Random text Random text...</p> </section> <section id="footertag"> <h2>HTML Footer tag</h2> <p>Random text Random text Random text...</p> </section> </body> </html>
Output:
The
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!