Note: Both Start and End tag are required for the Address tag in HTML5, i.e.,
……..- The address tag cannot represent arbitrary addresses (i.e., addresses irrelevant to the contact information).
- The address tag should not contain information other than contact information, like a publication date (for that, use
Syntax
Below is the Syntax mentioned :
1. HTML/XHTML
<body> <footer> ... </footer> <body>
2. CSS
footer{
--your css code—
}
Important Points in Address Tag
Below are mentioned some important points regarding the tag:
- If any, an element is formally placed inside the
- Earlier, it used to be the case that an element could only represent the contact info of the document’s author. However, its definition has been upgraded in the latest spec versions, as it can now be used for arbitrary markup addresses.
- An element should not contain more information than the contact information, like a publication date (for that, use
- The Only permitted content type for Address tag is flow content means tag, as a parent, cannot have nested element; then the same content cannot have tag as its parent.
- Most browsers will render the text within the tag in Italics, but you can change this behavior by CSS styling.
- The address tag cannot represent arbitrary addresses (e.g., postal addresses) unless those addresses are contact information for the section. To display postal addresses, use the
tag.
- The tag is not allowed to contain
, - For Internet Explorer browsers older than IE 9, use HTML5, which is a JavaScript workaround to provide support for the new HTML5 elements such as
, , , ,
Tag-Specific Attributes
No specific attribute can be used with the
tag.1. Global Attributes
Like all other HTML tags, the
tag also supports the global attributes in HTML5. The following are the global attributes:- accesskey
- class
- contenteditable
- contextmenu
- dir
- draggable
- dropzone
- hidden
- id
- itemid
- itemprop
- itemref
- itemscope
- itemtype
- lang
- spellcheck
- style
- tabindex
- title
- translate
For a full explanation of these attributes, visit https://www.educba.com/html-attributes/.
2. Event Attributes
The
tag in HTML5 also supports all the Event Attributes. Here are the following event handler content attributes.- onabort
- oncancel
- onblur
- oncanplay
- oncanplaythrough
- onchange
- onclick
- oncontextmenu
- ondblclick
- ondrag
- ondragend
- ondragenter
- ondragexit
- ondragleave
- ondragover
- ondragstart
- ondrop
- ondurationchange
- onemptied
- onended
- onerror
- onfocus
- onformchange
- onforminput
- oninput
- oninvalid
- onkeydown
- onkeypress
- onkeyup
- onload
- onloadeddata
- onloadedmetadata
- onloadstart
- onmousedown
- onmousemove
- onmouseout
- onmouseover
- onmouseup
- onmousewheel
- onpause
- onplay
- onplaying
- onprogress
- onratechange
- onreadystatechange
- onscroll
- onseeked
- onseeking
- onselect
- onshow
- onstalled
- onsubmit
- onsuspend
- ontimeupdate
- onvolumechange
- onwaiting
For a full explanation of these attributes, visit https://www.educba.com/html-event-attributes/
CSS text formatting properties in tag
- Text-color
- Text-alignment
- Text-decoration
- Text-transformation
- Line-height
- Text-direction
- Text-shadow
- Word-spacing
CSS Font properties in tag
- font-style – normal|italic|oblique|initial|inherit
- font-variant – normal|small-caps|initial|inherit
- font-weight – normal|bold|bolder|lighter|number|initial|inherit
- font-size – medium|xx-small|x-small|small|large|x-large|xx-large|smaller|larger|length|initial|inherit
- font-family – family-name|generic-family|initial|inherit
CSS Test Shadow property for tag
<style>
address{
text-shadow: 1px 1px #FF0000;
}
</style>
Note: If the footer contains contact details, put them in the
tag.Examples of Address Tag in HTML
Below are the examples of Address Tag in HTML:
Example #1
Code:
<!DOCTYPE html> <html> <head> . . . </head> <body> <header> <h1>HTML Address tag example</h1> </header> <main> <article> An article on HTML Address 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:
Example #2
Code:
<!DOCTYPE html> <html> <head> . . . </head> <body> <header> <h1>HTML Address tag example</h1> </header> <div> <address> A- 406, Boomerang, Chandivali Farm Road, Yadav Nagar, Chandivali, Powai, Maharashtra, Mumbai - 400072. </address> </div> </body> </html>
Output:
Example #3
Code:
<!DOCTYPE html> <html> <head> . . . </head> <body> <header> <h1>HTML Address tag example</h1> </header> <div> <address> We are always here to help. If you have a requirement / query about our services; email us at <a href="[email protected]">[email protected]</a> and we'll do our best to reply within 24 hours </address> </div> </body> </html>
Output:
Conclusion
Below are mentioned some of the main key points which you should remember from this topic:
- The HTML element is always in the tag.
- The HTML tag provides the contact information for the closest ancestor in HTML 4.01.
- The HTML tag includes contact information for the closest
or ancestor in HTML5. - The tag is usually placed inside the
- Do not place the publication date inside the tag; use the
- Most browsers will render the text within the tag in Italics, but you can change this behavior by CSS styling.
The above is the detailed content of Address Tag in HTML. For more information, please follow other related articles on the PHP Chinese website!