Tab panel
Tabs are used to arrange information and input fields of a data input form on several dialog boxes located one behind the other. Thereby, there is always a dialog box in the foreground. Clicking on the corresponding tab brings another tab into the foreground, whereby the information and any settings made on the previously used tabs remain in place.
Tabs can be added or removed either via the settings (see 
and 
icons on the right of the image), or directly via drag & drop or the element tree.
All direct child elements of a tab panel are 'treated' as tabs. Tabs can also contain other tab panels. The labels of these elements define the captions of the tab riders.
Tab Icons
A tab icon can be defined in the property section "Common" of the tab element.
CSS special class
If a CSS class is activated for a tab (layout section CSS class or action CSS class), this CSS class is set on the content container as well as on the tab header.
Therefore, more specific CSS selectors are usually needed to style the header and the content separately.
CSS class 'myCssClass' example:
The figure makes it clear that both the header and the content container of the selected tab have been given the CSS class 'myCssClass'.