Selection Customization in Angular Grid Component

18 Nov 20181 minute to read

The appearance of selection in the Angular Data Grid component can be customized using CSS. Here are examples for customizing the row selection background, cell selection background, and column selection background.

Customizing the row selection background

The .e-selectionbackground class is used to style the row selection background.

.e-grid td.e-selectionbackground {
    background-color: #00b7ea;
}

Row selection

Customizing the cell selection background

The .e-cellselectionbackground class is used to style the cell selection background.

.e-grid td.e-cellselectionbackground {
    background-color: #00b7ea;
}

Cell selection

Customizing the column selection background

The .e-columnselection class is used to style the column selection background.

.e-grid .e-columnselection {
    background-color: #aec2ec;
}

Cell selection