ASP.NET MVC コントロールヘルプ
スタイル設定とCSS
コントロールの使用 > FlexGrid > FlexGridの使用 > スタイル設定とCSS

CSS Classes for FlexGrid control are as follows:

Class

Description

.wj-flexgrid

Styles the div host element of the FlexGrid control.

.wj-topleft .wj-cell

Styles the TopLeft corner cell/cells.

.wj-colheaders .wj-cell

Styles all the column header cells.

.wj-rowheaders .wj-cell

Styles all the row header cells.

.wj-header

Styles the header cells including column header, row header and top left cell.

.wj-row .wj-cell

Styles all the rows in grid.

.wj-alt

Styles the alternative rows in grid.

.wj-cells .wj-cell

Styles all the cells in the scrollable area (data cells).

.wj-cell

Styles all the cells in grid including column header, row header and top left cell.

.wj-bottomleft .wj-cell

Styles the div element containing cells collection for bottom left area.

.wj-colfooters .wj-cell

Styles the div element containing cells collection for column footers.

.wj-align-right

Styles the right aligned columns.

.wj-align-center

Styles the center aligned columns.

Selection

.wj-state-selected

Styles the active cell and currently selected item in the drop down list.

.wj-state-multi-selected

Styles all the cells in the selected cell range except the active cell.

.wj-marquee

Styles the Excel-style element that highlights the selection when the showMarquee property is set to true.

.wj-state-active

Styles the active cell.

.wj-colheaders .wj-state-multi-selected

Styles the selected column headers when the showSelectedHeaders property is set to true.

.wj-rowheaders .wj-state-multi-selected

Styles the selected row headers when the showSelectedHeaders property is set to true.

Editing

.wj-grid-editor

Styles the cell editor element.

.wj-glyph-pencil

Styles the pencil icon displayed in the row header of the currently editing row.

.wj-glyph-asterisk

Styles the asterisk icon displayed in the row header of the new row template.

Validation

.wj-state-invalid

Styles the invalid cells.

Freezing

.wj-frozen

Styles non-header frozen cells.

.wj-frozen-row

Styles cells in the last frozen row. This style can be used to create a horizontal divider line between the frozen and scrollable rows.

.wj-frozen-col

Styles cells in the last frozen column. This style can be used to create a vertical divider line between the frozen and scrollable columns.

Sorting

.wj-glyph-up

Styles the up-arrow icon displayed in the column header of a column sorted in ascending order.

.wj-glyph-down

Styles the down-arrow icon displayed in the column header of a column sorted in descending order.

Grouping

.wj-group

Styles the group row.

.wj-glyph-down-right

Styles the expand icon displayed in the group row for the expanded group.

.wj-glyph-right

Styles the collapse icon displayed in the group row for the collapsed group.

.wj-grouppanel

Styles the div host element for GroupPanel control.

.wj-groupmarker

Styles the div element for each grouped column displayed in the GroupPanel control.

.wj-remove

Styles the (x) mark displayed in the group panel for each column header element.

Filtering

.wj-glyph-filter

Styles the filter icon displayed in column headers.

.wj-filter-on

Styles the filter icon when the column has been filtered.

.wj-filter-off

Styles the filter icon when the column has not been filtered.

.wj-columnfiltereditor

Styles the div host element for FilerDialog.

.wj-valuefilter-editor

Styles the div host element for Value Filter.

.wj-conditionfilter-editor

Styles the div host element for Condtion Filter.

Drag Drop

.wj-marker

Styles the marker displayed in the row/column header of the row/column where the dragged row/column will be dropped.

.wj-state-dragsrc

Styles the target row/column which is being dragged.

RowDetail

.wj-glyph-plus

Styles the Plus icon displayed in the row headers of the collapsed detail row.

.wj-glyph-minus

Styles the Minus icon displayed in the row headers for the expanded detail row.