Style and appearance in EJ2 TypeScript List box control
2 May 20231 minute to read
To modify the ListBox appearance, you need to override the default CSS of ListBox component. Please find the list of CSS classes and its corresponding section in ListBox component. Also, you have an option to create your own custom theme for all the JavaScript controls using our Theme Studio.
| CSS Class | Purpose of Class | |
|---|---|---|
| .e-listbox-wrapper | To customize the listbox wrapper | |
| .e-list-parent .e-list-item | To customize the listbox list items | |
| .e-list-parent .e-list-item:hover | To customize the listbox list items on hover | |
| .e-list-parent .e-list-item.e-selected | To customize the listbox selected list item | |
| .e-listboxtool-wrapper .e-listbox-tool | To customize the listbox toolbar | |
| .e-listboxtool-wrapper .e-listbox-tool .e-btn | To customize the listbox toolbar button | |
| .e-listboxtool-wrapper .e-listbox-tool .e-btn .e-btn-icon.e-icons::before | To customize the listbox toolbar icon |