A | B | C | D | E | F | G | H | CH | I | J | K | L | M | N | O | P | Q | R | S | T | U | V | W | X | Y | Z | 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9
HTML |
---|
Comparisons |
HTML5 Article is a HTML5 semantic element, similar to <section>
and <header>
. It is most commonly used to contain information that may be distributed independently from the rest of the site or application it appears in.
Features and usage
The HTML5 <article>
element represents a complete composition in a web page or web application that is independently distributable or reusable, e.g. in syndication. This could be a forum post, a magazine or newspaper article, a blog entry, a user-submitted comment, an interactive widget or gadget, or any other independent item of content.[1]
Examples
At its most basic, <article>
can be used to encapsulate a body of text and a corresponding title like so:
<article>
<h2>Insert Title Here</h2>
<p>Insert a paragraph of text here</p>
</article>
Forum entries and comments are typically implemented by nesting <article>
tags:
<article>
<header>
<h1>Entry Title</h1>
<p>Header Info</p>
</header>
<p>Content of entry...</p>
<article>
<header>
<h2>Author: John Smith</h2>
<p>Comment Info</p>
</header>
<p>Comment text...</p>
</article>
<article>
<header>
<h2>Author: Jane Johnson</h2>
<p>2nd Comment's Info</p>
</header>
<p>Comment text...</p>
</article>
</article>
Attributes
The <article>
element only includes the global HTML attributes such as contenteditable, id, and title.[2] However, pubdate, an optional boolean attribute of the <time>
element, is often used in conjunction with <article>
. If present, it indicates that the <time>
element is the date the <article>
was published. Note that pubdate applies only to the parent <article>
element, or to the document as a whole.[3]
Comparison with <section>
HTML5 introduced both <article>
and <section>
; both are semantic tags, defining sections in a document, such as chapters, headers, footers.[4][unreliable source?] The <article>
element is effectively a specialized kind of <section>
and it has a more specific meaning, referring to an independent, self-contained block of related content.[3][5]
Nesting examples
To better organize independent content <section>
tags can be nested inside <article>
tags:
<article>
<h2>Names of Shapes</h2>
<p>There are several different types of shapes...</p>
<section>
<h4>Triangles</h4>
<p>Here is some info about triangles</p>
</section>
<section>
<h4>Circles</h4>
<p>These Pi-shaped wonders are mesmerizing and...</p>
</section>
</article>
Conversely, it may sometime be appropriate to nest an <article>
element inside a <section>
element. For example, in a web page containing several articles on varying subjects:
<section>
<h1>Articles about Paris Tourism</h1>
<article>
<h3>The Eiffel Tower</h3>
<p>Standing at over 12 inches high...</p>
</article>
<article>
<h3>The Louvre</h3>
<p>A must-see in Paris tourism...</p>
</article>
</section>
Browser support
The following browsers have support for this element:[6]
- Desktop
- Google Chrome 5.0 and higher
- Firefox 4.0 and higher
- Internet Explorer 9.0 and higher
- Safari 4.1 and higher
- Opera 11.1 and higher
- Mobile
- Android 2.2 and higher
- Firefox Mobile (Gecko) 4.0 and higher
- IE Mobile 9.0 and higher
- Safari Mobile 5.0 and higher
- Opera Mobile 11.0 and higher
References
- ^ "HTML5 article element - W3C". W3.org. Retrieved 2014-05-08.
- ^ "The Article Contents element". MDN Web Docs. Retrieved 2018-07-09.
- ^ a b "The article element". html5doctor.com. Retrieved 2018-07-09.
- ^ "The section tag". W3Schools. 2014-04-30. Retrieved 2014-05-08.
- ^ "HTML5: Section or Article?". Iandevlin.com. 2013-08-19. Retrieved 2014-05-08.
- ^ "Can I use... Support tables for HTML5, CSS3, etc". caniuse.com. Retrieved 2018-07-09.
External links
Text je dostupný za podmienok Creative Commons Attribution/Share-Alike License 3.0 Unported; prípadne za ďalších podmienok. Podrobnejšie informácie nájdete na stránke Podmienky použitia.
Antropológia
Aplikované vedy
Bibliometria
Dejiny vedy
Encyklopédie
Filozofia vedy
Forenzné vedy
Humanitné vedy
Knižničná veda
Kryogenika
Kryptológia
Kulturológia
Literárna veda
Medzidisciplinárne oblasti
Metódy kvantitatívnej analýzy
Metavedy
Metodika
Text je dostupný za podmienok Creative
Commons Attribution/Share-Alike License 3.0 Unported; prípadne za ďalších
podmienok.
Podrobnejšie informácie nájdete na stránke Podmienky
použitia.
www.astronomia.sk | www.biologia.sk | www.botanika.sk | www.dejiny.sk | www.economy.sk | www.elektrotechnika.sk | www.estetika.sk | www.farmakologia.sk | www.filozofia.sk | Fyzika | www.futurologia.sk | www.genetika.sk | www.chemia.sk | www.lingvistika.sk | www.politologia.sk | www.psychologia.sk | www.sexuologia.sk | www.sociologia.sk | www.veda.sk I www.zoologia.sk