The content component provides an easy to use content area with some useful methods
to control the scrollable area. There should only be one content in a single
Content, along with many other Ionic components, can be customized to modify its padding, margin, and more using the global styles provided in the CSS Utilities or by individually styling it using CSS and the available CSS Custom Properties.
By default, content fills the space between a header and footer but does not go behind them. In certain cases, it may be desired to have the content scroll behind the header and footer, such as when the translucent property is set on either of them, or opacity is set on the toolbar. This can be achieved by setting the fullscreen property on the content to true.
To place elements outside of the scrollable area, assign them to the fixed slot. Doing so will absolutely position the element to the top left of the content. In order to change the position of the element, it can be styled using the top, right, bottom, and left CSS properties.
Content provides methods that can be called to scroll the content to the bottom, top, or to a specific point. They can be passed a duration in order to smoothly transition instead of instantly changing the position.
The color to use from your application's color palette. Default options are: "primary", "secondary", "tertiary", "success", "warning", "danger", "light", "medium", and "dark". For more information on colors, see theming.
If true and the content does not cause an overflow scroll, the scroll interaction will cause a bounce. If the content exceeds the bounds of ionContent, nothing will change. Note, this does not disable the system bounce on iOS. That is an OS level setting.
Get the element where the actual scrolling takes place. This element can be used to subscribe to scroll events or manually modify scrollTop. However, it's recommended to use the API provided by ion-content:
i.e. Using ionScroll, ionScrollStart, ionScrollEnd for scrolling events and scrollToPoint() to scroll the content into a certain point.