Long labels can wrap if the 'wrap' property is set.
First name Date of birth JobManagerSalesDeveloper Description label test
The ui5-label is a component used to represent a label, providing valuable information to the user. Usually it is placed next to a value holder, such as a text field. It informs the user about what data is displayed or expected in the value holder.
The ui5-label appearance can be influenced by properties, such as required and wrap. The appearance of the Label can be configured in a limited way by using the design property. For a broader choice of designs, you can use custom styles.
ES6 Module Import
You can use both properties and attributes with the same effect. The name of each attribute is listed below the name of the property, if different.
Defines the labeled input by providing its ID.
Note: Can be used with both ui5-input and native input.
Defines whether an asterisk character is added to the ui5-label text.
Note: Usually indicates that user input is required.
Defines whether semi-colon is added to the ui5-label text.
Note: Usually used in forms.
Determines whether the ui5-label should wrap, when there is not enough space.
Note: By default the text would truncate.
This Element provides slot(s). This means it can display its child nodes.
Unless targeting the default slot, use the slot attribute to define the destination slot for each child.
Text, along with HTML Elements with no slot attribute, goes the the default slot.
Defines the text of the ui5-label. Note: Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
Theme:Quartz LightQuartz DarkQuartz High Contrast BlackQuartz High Contrast WhiteBelizeHigh Contrast BlackHigh Contrast White