ASPxCalendar.DayHeaderStyle Property

Gets the style properties for the calendar’s section that displays the day of the week.

Namespace: DevExpress.Web

Assembly: DevExpress.Web.v24.1.dll

NuGet Package: DevExpress.Web

Declaration

C#

public CalendarElementStyle DayHeaderStyle { get; }

VB.NET

Public ReadOnly Property DayHeaderStyle As CalendarElementStyle

Property Value

Type	Description
CalendarElementStyle	A CalendarElementStyle object defining the day of the week header’s appearance.

Remarks

This property is a wrapper of the CalendarProperties.DayHeaderStyle property.

Example

This section of the Custom Day Rendering online demo illustrates how to customize the ASPxCalendar settings.

ASPX

...
<dxe:ASPxCalendar ID="clndWeatherForecast" runat="server" 
             OnDayRender="OnCalendarDayRender" ShowClearButton="False" 
             ShowTodayButton="False" ShowWeekNumbers="False" Font-Size="8pt" 
             Font-Names="Trebuchet MS" ForeColor="#07519A" 
             ClientInstanceName="Calendar" SkinID="None" 
             EnableViewState="False" BackColor="White">
             <ButtonStyle BackColor="#EBF3FB" Width="80px" Cursor="pointer">
                 <HoverStyle BackColor="#E2ECF8" />
                 <PressedStyle BackColor="#C4DCF4" />
                 <Border BorderWidth="1px" BorderStyle="Solid" BorderColor="#AACCEE" />
             </ButtonStyle>
             <PrevMonthImage Height="17px" Width="19px" AlternateText="Previous month" 
             Url="Images/CustomDayRendering/Elements/leftSingleArrow.png" />
             <NextMonthImage Height="17px" Width="19px" AlternateText="Next  month" 
             Url="Images/CustomDayRendering/Elements/rightSingleArrow.png" />
             <BorderRight BorderStyle="None" />
             <DayHeaderStyle Font-Size="12pt">
              <BorderBottom BorderWidth="1px" BorderStyle="Solid" BorderColor="#AACCEE" />
              <BorderRight BorderWidth="1px" BorderStyle="Solid" BorderColor="#AACCEE" />
             </DayHeaderStyle>
             <MonthGridPaddings Padding="0px" />
             <Border BorderStyle="Solid" BorderColor="#AACCEE" BorderWidth="1px" />
             <NextYearImage Height="17px" Width="19px" AlternateText="Next year" 
             Url="Images/CustomDayRendering/Elements/rightDoubleArrow.png" />
             <HeaderStyle Spacing="5px" HorizontalAlign="Center" Font-Size="16pt" 
             BackColor="#EBF3FB" ForeColor="#51A8DF">
                 <Paddings PaddingTop="3px" PaddingRight="5px" PaddingBottom="3px" 
                 PaddingLeft="5px" />
                 <BackgroundImage Repeat="RepeatX" VerticalPosition="bottom" 
                 ImageUrl="Images/CustomDayRendering/Elements/headerBg.png" />
                 <Border BorderWidth="1px" BorderStyle="Solid" BorderColor="#AACCEE" />
                 <BorderTop BorderStyle="None" />
                 <BorderLeft BorderStyle="None" />
             </HeaderStyle>
             <FastNavFooterStyle Spacing="5px" HorizontalAlign="Center" BackColor="#EBF3FB">
                 <Paddings Padding="10px" />
                 <Border BorderWidth="1px" BorderStyle="Solid" BorderColor="#AACCEE" />
                 <BorderTop BorderStyle="None" />
             </FastNavFooterStyle>
             <FastNavMonthStyle Font-Italic="False" Cursor="pointer">
                 <Paddings PaddingTop="5px" PaddingRight="2px" PaddingBottom="5px" 
                 PaddingLeft="2px" />
                 <HoverStyle BackColor="#E2ECF8">
                     <Border BorderWidth="1px" BorderStyle="Solid" BorderColor="#AACCEE" />
                 </HoverStyle>
                 <SelectedStyle BackColor="#C4DCF4" />
             </FastNavMonthStyle>
             <DayOtherMonthStyle ForeColor="#C9DEF4">
             <BackgroundImage ImageUrl="Images/CustomDayRendering/Elements/otherMonthDayBg.png" />
             </DayOtherMonthStyle>
             <PrevYearImage Height="17px" Width="19px" AlternateText="Previous year" 
             Url="Images/CustomDayRendering/Elements/leftDoubleArrow.png" />
             <DayStyle VerticalAlign="Top" Cursor="default">
                 <Paddings Padding="3px" />
                 <Border BorderWidth="1px" BorderStyle="Solid" BorderColor="#AACCEE" />
                 <BorderTop BorderStyle="None" />
                 <BorderLeft BorderStyle="None" />
             </DayStyle>
             <FastNavPrevYearImage Height="17px" Width="19px" AlternateText="Previous year" 
             Url="Images/CustomDayRendering/Elements/leftSingleArrow.png" />
             <FastNavYearStyle Cursor="pointer">
                 <Paddings PaddingTop="2px" Padding="4px" />
                 <HoverStyle BackColor="#E2ECF8">
                     <Border BorderWidth="1px" BorderStyle="Solid" BorderColor="#AACCEE" />
                 </HoverStyle>
                 <SelectedStyle BackColor="#C4DCF4" />
             </FastNavYearStyle>
             <BorderBottom BorderStyle="None" />
             <FastNavNextYearImage Height="17px" Width="19px" AlternateText="Next year" 
             Url="Images/CustomDayRendering/Elements/rightSingleArrow.png" />
             <DaySelectedStyle BackColor="#E2ECF8" />
             <FastNavStyle MonthYearSpacing="8px" HorizontalAlign="Center" VerticalAlign="Top" 
              Font-Size="12pt" Font-Bold="False" 
                 BackColor="#EBF3FB" ImageSpacing="12px">
                 <Paddings Padding="10px" />
                 <Border BorderWidth="1px" BorderStyle="Solid" BorderColor="#AACCEE" />
             </FastNavStyle>
         </dxe:ASPxCalendar>
...