RadCalendar for ASP.NET AJAX

RadControls for ASP.NET AJAX

The RadCalendar controls come with a set of predefined styles, which are specified by the styles in the current skin CSS classes. If the Skin property is not set to an empty string, you can use a variety of style properties to further customize the appearance of the control.

Setting these properties will copy any non-blank elements of the specified style to the specific element of the rendered control, overwriting any existing style elements defined by the used skin.

Caution

Setting a style property does not always affect the appearance of a control, if the skin has a setting that applies to a more specific element.

RadCalendar styles

The following table lists the styles that you can assign to a stand-alone RadCalendar control or the embedded RadCalendar control that acts as a popup to RadDatePicker and RadDateTimePicker:

PropertyDefault CSS ClassDescription
CalendarTableStylercMainTableThe style for the day matrix in the main area of the calendar.
DayStyleThe style for the regular days in the displayed month (i.e. without selected days, special days, weekends, etc.).
DayOverStylercHoverThe style that is applied when the mouse hovers over the calendar days.
SelectedDayStylercSelectedThe style applied to the selected dates.
WeekendDayStylercWeekendThe style applied to the weekend dates.
DisabledDayStyleThe style applied to the disabled dates.
OtherMonthDayStylercOtherMonthThe style applied to the days on the Calendar control that are not in the current month.
OutOfRangeDayStylercOutOfRangeThe style for the days on the Calendar control that are out of the predefined range.
HeaderStyleThe style for the row and column selectors.
TitleStyleThe style of the Calendar title.
FastNavigationStyleRadCalendarMonthView_[skin name]The style applied to the Month/Year fast navigation popup.
Note

In addition to the style properties listed above, if the calendar has any special days defined, you can set their ItemStyle property to customize the appearance of the special day.

RadTimeView Styles

The following table lists the styles that you can assign to the embedded RadTimeView control that acts as a popup to RadTimePicker and RadDateTimePicker:

PropertyDefault CSS ClassDescription
TimeStyleThe style for the selectable time values.
AlternatingTimeStyleThe style for every other selectable time value.
TimeOverStylercHoverThe style that is applied when the mouse hovers over a time value.
HeaderStylercHeaderThe style for the header region.
FooterStylercFooterThe style for the footer region.

RadInput Styles

The following table lists the styles that you can assign to the embedded RadInput control of RadDatePicker, RadTimePicker, and RadDateTimePicker:

PropertyDefault CSS classDescription
EnabledStyleriEnabledThe style for the enabled input control.
DisabledStyleriDisabledThe style that is applied for the disabled input control.
EmptyMessageStyleriEmptyThe style when the value is not set and the input control does not have focus.
FocusedStyleriFocusedThe style when the input control has focus.
HoveredStyleriHoverThe style when the mouse hovers over the input control.
InvalidStyleriErrorThe style when the value of the input control is invalid.
Note

The CSS class definitions for the embedded RadInput control are found in the Input CSS skin file rather than the Calendar CSS file.

See Also