注意: HTML5 中的 Address 標籤需要開始和結束標籤,即
……..- 地址標籤不能代表任意地址(即與聯絡資訊無關的地址)。
- 地址標籤不應包含聯絡資訊以外的信息,例如發布日期(為此,請使用
文法
以下是提到的語法:
1。 HTML/XHTML
<body> <footer> ... </footer> <body>
2。 CSS
footer{ --your css code— }
地址標籤中的重要要點
下面提到了有關標籤的一些要點:
- 如果有的話,元素正式放置在
- 之前, 曾經是這樣的情況。元素只能代表文檔作者的聯絡資訊。然而,它的定義在最新的規範版本中已經升級,因為它現在可以用於任意標記位址。
- ;元素不應包含比聯絡資訊更多的信息,例如發布日期(為此,請使用
- 位址標籤唯一允許的內容類型是流內容,意思是作為父標籤,不能巢狀 標籤。元素;然後相同的內容不能有 標籤作為其父級。
- 大多數瀏覽器都會呈現 內的文字斜體標籤,但您可以透過 CSS 樣式變更此行為。
- 地址標籤不能代表任意地址(例如郵寄地址),除非這些地址是該部分的聯絡資訊。若要顯示郵寄地址,請使用
標籤。
- ;標籤不允許包含
、 - 對於早於IE 9 的Internet Explorer 瀏覽器,請使用HTML5,這是一種JavaScript 解決方法,可為新的HTML5 元素(例如
、 、 、 、 、、
標籤特定屬性
不能使用特定屬性標籤。1.全域屬性
像所有其他 HTML 標籤一樣,
標籤也支援HTML5中的全域屬性。以下是全域屬性:- 訪問鍵
- 班級
- 內容可編輯
- 上下文選單
- 目錄
- 可拖曳
- 降落區
- 隱藏
- id
- 項目
- itemprop
- 項目參考
- 專案範圍
- 項目類型
- 郎
- 拼字檢查
- 風格
- 標籤索引
- 標題
- 翻譯
有關這些屬性的完整說明,請造訪 https://www.educba.com/html-attributes/。
2.事件屬性
; HTML5 中的 tag 也支援所有事件屬性。以下是以下事件處理程序內容屬性。
- 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.