How to: Customize Calendar Web Server Control Appearance
Because the Calendar control is a complex control made up of many individual elements, it offers you a wide variety of options for customizing its appearance.
Changing General Calendar Appearance
The Calendar control establishes a default look for the calendar on the page, but you can change the calendar's overall appearance. If you set appearance properties for individual calendar elements, such as today's date, the selected date, and so on, the individual settings are based on the default settings you make for the calendar as a whole. You can also select from predefined formats.
.gif "Note") Note |
|---|
By default, there is no special formatting to indicate today's date on the Calendar control. For details about how to set this format, see Formatting Web Calendar Elements Using Styles. |
To change the general appearance of the Calendar control
Set properties as listed in the following table.
To specify Set this property Font, text and background color
Overall control size
Margins and spacing around individual days
Color, size, and style (for example, dotted) of border and grid lines
BorderStyle (set to a BorderStyle enumeration value: Dotted, Dashed, Solid, and so on).
ShowGridLines (true or false)
Changing Day-of-Week Display
By default, the names of the days of the week are displayed in a row at the top of the calendar. You can control the format of this row.
To change the day of week display
Set properties as listed in the following table.
To Set this property Enable or disable the row that deploys days of the week
ShowDayHeader (true or false)
Specify the format of day names (for example, full day name or abbreviation)
DayNameFormat (use a value in the DayNameFormat enumeration: Full, Short, FirstLetter, FirstTwoLetters).
Specify which day starts the week (default is Sunday)
FirstDayOfWeek (use a day defined in the FirstDayOfWeek enumeration.
Set color, font, border style and width, and so on
DayHeaderStyle, which incorporates style information.
Changing the Month Display and Navigation Links
The title bar by default displays the name of the current month and a set of navigation links (LinkButton controls) that allow users to move to the next and previous months.
To change month display and navigation links
Set properties as listed in the following table.
To Set this property Remove the title bar altogether (which disables month navigation).
ShowTitle (true or false)
Specify the format of the name of the month (for example, full name or abbreviation) and optionally add a year.
TitleFormat (set to a value in the TitleFormat enumeration: Month or MonthYear).
Specify the format and text of month navigation links
NextPrevFormat (use a value in the NextPrevFormat enumeration: Month or CustomText).
NextMonthText and PrevMonthText (set to strings)
Set color, font, border style and width, and so on
TitleStyle, which incorporates style information. For details, see Formatting Web Calendar Elements Using Styles.
Note
You can format the navigation links separately using the NextPrevStyle property.
| Note |
|---|
You can use HTML tags within the property string. |