Skip to main content

Text

Overview

The ui5-text component displays text that can be used in any content area of an application.

Usage

  • Use the ui5-text if you want to display text inside a form, table, or any other content area.
  • Do not use the ui5-text if you need to reference input type of components (use ui5-label).

Responsive behavior

The ui5-text component is fully adaptive to all screen sizes. By default, the text will wrap when the space is not enough. In addition, the component supports truncation via the max-lines property, by defining the number of lines the text should wrap before start truncating.

ES6 Module Import

import "@ui5/webcomponents/dist/Text";

Basic Sample​

Properties​

maxLines​

DescriptionDefines the number of lines the text should wrap before it truncates.
Type-
DefaultInfinity

Slots​

default​

DescriptionDefines the text of the component.
TypeArray<Node>

Events​

No events available for this component.

Methods​

No methods available for this component.

CSS Parts​

No CSS parts available for this component.

More Samples​

Max Lines​

The maxLines property defines the number of lines the text would wrap before start truncating.

Custom Styling​

The Text can be customized with pure CSS, applied on the tag.