The tag represents an independent self-contained content in an HTML document. The article tag is one of the new sectioning elements in HTML 5.
An article should have its own meaning and easily differentiated from the other web page contents. In simple words, the HTML tag is used to represent an article.
A potential sources for element:
- Blog post
- Forum post
- Newspaper article
- User-submitted Comment
On a page with a single piece of content, it requires a single tag. But on a page with multiple contents such as index page , search result page , category page , there are multiple elements that should be used.
Estimated reading time: 3 minutes
Syntax:
The tag contains both an opening tag and closing tag. The content is written between these two tags.
Sample of the HTML Tag:
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
</head>
<body>
<article>
<h1>This is the title of the document</h1>
<p>This is the sample paragraph</p>
</article>
</body>
</html>
Result:
Tag Styling Methods:
The tag supports the global attributes and the event attributes. You can use the following properties to style an HTML article tag.
Properties to style the visual weight/emphasis/size of the text in tag:
- CSS font-style – This CSS property helps to set the font style of the text such as normal, italic, oblique, initial, inherit.
- CSS font-family – This CSS property specifies a prioritized list of one or more font family names or generic family names for the selected element.
- CSS font-size – This CSS property will help to set the size of the font.
- CSS font-weight – This CSS property used to define whether the font should be bold or thick.
- CSS text-transform – This CSS property will control the text case and capitalization.
- CSS test-decoration – This CSS property specifies the decoration added to text such as text-decoration-line , text-decoration-color , text-decoration- style.
Styles to coloring the text in Tag:
- CSS color – This CSS property will specify the color of the text content and decorations.
- CSS background-color – This CSS property helps to set the background color of an element.
Text layout styles for Tag:
- CSS text-indent – This CSS property is used to specify the indentation of the first line in a text block.
- *CSS text-overflow * – This CSS property helps to describe how overflowed content that is not displayed should be signaled to the user.
- CSS white-space – This CSS property describes how white-space inside an element is handled.
- CSS word-break – This CSS property decides where the lines should be broken.
Other Properties for Tag:
- CSS text-shadow – This CSS property helps to add the shadow to text.
- CSS text-align-last – This CSS property will set the alignment of the last line of the text.
- CSS line-height – This CSS property defines the height of a line.
- CSS letter-spacing – This CSS property helps to decide the spaces between letters/characters in a text.
- CSS word-spacing – This CSS property specifies the spacing between every word.
Browser Support:
Related Articles:
The post HTML Article Tag appeared first on Share Point Anchor.
Top comments (0)