Skip to content

Commit

Permalink
<body> element: enhance attribute section (#36696)
Browse files Browse the repository at this point in the history 
* <body> element: enhance attribute section

* Update files/en-us/web/html/element/body/index.md

Co-authored-by: Chris Mills <chrisdavidmills@gmail.com>

---------

Co-authored-by: Chris Mills <chrisdavidmills@gmail.com>
  • Loading branch information
@estelle @chrisdavidmills
estelle and chrisdavidmills authored Nov 12, 2024
1 parent 28ae68b commit 8fbec53
Showing 1 changed file with 58 additions and 46 deletions.
104 changes: 58 additions & 46 deletions files/en-us/web/html/element/body/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,84 +11,95 @@ The **`<body>`** [HTML](/en-US/docs/Web/HTML) element represents the content of

## Attributes

This element includes the [global attributes](/en-US/docs/Web/HTML/Global_attributes).
This element includes the [global attributes](/en-US/docs/Web/HTML/Global_attributes), event attributes, and deprecated attributes:

- `alink` {{deprecated_inline}}
- : Color of text for hyperlinks when selected.
**Do not use this attribute! Use the CSS {{cssxref("color")}} property in conjunction with the {{cssxref(":active")}} pseudo-class instead.**
- `background` {{deprecated_inline}}
- : URI of an image to use as a background.
**Do not use this attribute! Use the CSS {{cssxref("background")}} property on the element instead.**
- `bgcolor` {{deprecated_inline}}
- : Background color for the document.
**Do not use this attribute! Use the CSS {{cssxref("background-color")}} property on the element instead.**
- `bottommargin` {{deprecated_inline}}
- : The margin of the bottom of the body.
**Do not use this attribute! Use the CSS {{cssxref("margin-bottom")}} property on the element instead.**
- `leftmargin` {{deprecated_inline}}
- : The margin of the left of the body.
**Do not use this attribute! Use the CSS {{cssxref("margin-left")}} property on the element instead.**
- `link` {{deprecated_inline}}
- : Color of text for unvisited hypertext links.
**Do not use this attribute! Use the CSS {{cssxref("color")}} property in conjunction with the {{cssxref(":link")}} pseudo-class instead.**
- `onafterprint`
### Event attributes

> [!NOTE]
> Each of the below event attribute names is linked to its equivalent {{domxref("Window")}} interface event. You can listen to these events using [`addEventListener()`](/en-US/docs/Web/API/EventTarget/addEventListener) instead of adding the `oneventname` attribute to the `<body>` element.
- [`onafterprint`](/en-US/docs/Web/API/Window/afterprint_event)
- : Function to call after the user has printed the document.
- `onbeforeprint`
- [`onbeforeprint`](/en-US/docs/Web/API/Window/beforeprint_event)
- : Function to call when the user requests printing of the document.
- `onbeforeunload`
- [`onbeforeunload`](/en-US/docs/Web/API/Window/beforeunload_event)
- : Function to call when the document is about to be unloaded.
- `onblur`
- [`onblur`](/en-US/docs/Web/API/Window/blur_event)
- : Function to call when the document loses focus.
- `onerror`
- [`onerror`](/en-US/docs/Web/API/Window/error_event)
- : Function to call when the document fails to load properly.
- `onfocus`
- [`onfocus`](/en-US/docs/Web/API/Window/focus_event)
- : Function to call when the document receives focus.
- `onhashchange`
- [`onhashchange`](/en-US/docs/Web/API/Window/hashchange_event)
- : Function to call when the fragment identifier part (starting with the hash (`'#'`) character) of the document's current address has changed.
- `onlanguagechange`
- [`onlanguagechange`](/en-US/docs/Web/API/Window/languagechange_event)
- : Function to call when the preferred languages changed.
- `onload`
- [`onload`](/en-US/docs/Web/API/Window/load_event)
- : Function to call when the document has finished loading.
- `onmessage`
- [`onmessage`](/en-US/docs/Web/API/Window/message_event)
- : Function to call when the document has received a message.
- `onmessageerror`
- [`onmessageerror`](/en-US/docs/Web/API/Window/messageerror_event)
- : Function to call when the document has received a message that cannot be deserialized.
- `onoffline`
- [`onoffline`](/en-US/docs/Web/API/Window/offline_event)
- : Function to call when network communication has failed.
- `ononline`
- [`ononline`](/en-US/docs/Web/API/Window/online_event)
- : Function to call when network communication has been restored.
- `onpageswap`
- [`onpageswap`](/en-US/docs/Web/API/Window/pageswap_event)
- : Function to call when you navigate across documents, when the previous document is about to unload.
- `onpagehide`
- [`onpagehide`](/en-US/docs/Web/API/Window/pagehide_event)
- : Function to call when the browser hides the current page in the process of presenting a different page from the session's history.
- `onpagereveal`
- [`onpagereveal`](/en-US/docs/Web/API/Window/pagereveal_event)
- : Function to call when a document is first rendered, either when loading a fresh document from the network or activating a document.
- `onpageshow`
- [`onpageshow`](/en-US/docs/Web/API/Window/pageshow_event)
- : Function to call when the browser displays the window's document due to navigation.
- `onpopstate`
- [`onpopstate`](/en-US/docs/Web/API/Window/popstate_event)
- : Function to call when the user has navigated session history.
- `onresize`
- [`onresize`](/en-US/docs/Web/API/Window/resize_event)
- : Function to call when the document has been resized.
- `onrejectionhandled`
- [`onrejectionhandled`](/en-US/docs/Web/API/Window/rejectionhandled_event)
- : Function to call when a JavaScript {{jsxref("Promise")}} is handled late.
- `onstorage`
- [`onstorage`](/en-US/docs/Web/API/Window/storage_event)
- : Function to call when the storage area has changed.
- `onunhandledrejection`
- [`onunhandledrejection`](/en-US/docs/Web/API/Window/unhandledrejection_event)
- : Function to call when a JavaScript {{jsxref("Promise")}} that has no rejection handler is rejected.
- `onunload`
- [`onunload`](/en-US/docs/Web/API/Window/unload_event)
- : Function to call when the document is going away.

### Deprecated attributes

> [!WARNING]
> Do not use these deprecated attributes; opt for the CSS alternatives listed with each deprecated attribute instead.
- `alink` {{deprecated_inline}}
- : Color of text for hyperlinks when selected.
Use the CSS {{cssxref("color")}} property in conjunction with the {{cssxref(":active")}} and {{cssxref(":focus")}} pseudo-classes instead.
- `background` {{deprecated_inline}}
- : URI of an image to use as a background.
Use the CSS {{cssxref("background-image")}} property instead.
- `bgcolor` {{deprecated_inline}}
- : Background color for the document.
Use the CSS {{cssxref("background-color")}} property instead.
- `bottommargin` {{deprecated_inline}}
- : The margin of the bottom of the body.
Use the CSS {{cssxref("margin-bottom")}} property (or the logical {{cssxref("margin-block-end")}} property) instead.
- `leftmargin` {{deprecated_inline}}
- : The margin of the left of the body.
Use the CSS {{cssxref("margin-left")}} property (or the logical {{cssxref("margin-inline-start")}} property) instead.
- `link` {{deprecated_inline}}
- : Color of text for unvisited hypertext links.
Use the CSS {{cssxref("color")}} property in conjunction with the {{cssxref(":link")}} pseudo-class instead.
- `rightmargin` {{deprecated_inline}}
- : The margin of the right of the body.
**Do not use this attribute! Use the CSS {{cssxref("margin-right")}} property on the element instead.**
Use the CSS {{cssxref("margin-right")}} property or the logical {{cssxref("margin-inline-end")}} property) instead.
- `text` {{deprecated_inline}}
- : Foreground color of text.
**Do not use this attribute! Use CSS {{cssxref("color")}} property on the element instead.**
Use the CSS {{cssxref("color")}} property instead.
- `topmargin` {{deprecated_inline}}
- : The margin of the top of the body.
**Do not use this attribute! Use the CSS {{cssxref("margin-top")}} property on the element instead.**
Use the CSS {{cssxref("margin-top")}} property (or the logical {{cssxref("margin-block-start")}} property) instead.
- `vlink` {{deprecated_inline}}
- : Color of text for visited hypertext links.
**Do not use this attribute! Use the CSS {{cssxref("color")}} property in conjunction with the {{cssxref(":visited")}} pseudo-class instead.**
Use the CSS {{cssxref("color")}} property in conjunction with the {{cssxref(":visited")}} pseudo-class instead.

## Examples

Expand Down Expand Up @@ -195,3 +206,4 @@ This element includes the [global attributes](/en-US/docs/Web/HTML/Global_attrib

- {{HTMLElement("html")}}
- {{HTMLElement("head")}}
- [Event handling overview](/en-US/docs/Web/Events/Event_handlers)

0 comments on commit 8fbec53

Please # to comment.