runat="server" />
当然我们还需要准备一个简单的样式表，让Calendar显得更漂亮，具体代码如下所示：
.MyCalendar .ajax__calendar_container {
border:1px solid #646464;
background-color: lemonchiffon;
color: red;
}
.MyCalendar .ajax__calendar_other .ajax__calendar_day,
.MyCalendar .ajax__calendar_other .ajax__calendar_year {
color: black;
}
.MyCalendar .ajax__calendar_hover .ajax__calendar_day,
.MyCalendar .ajax__calendar_hover .ajax__calendar_month,
.MyCalendar .ajax__calendar_hover .ajax__calendar_year {
color: black;
}
.MyCalendar .ajax__calendar_active .ajax__calendar_day,
.MyCalendar .ajax__calendar_active .ajax__calendar_month,
.MyCalendar .ajax__calendar_active .ajax__calendar_year {
color: black;
font-weight:bold;
}
注意：以上样式套用了页面输出客户端后系统为Calendar自动生成的ID，大家不需要理解这部分代码，只需要按照相应的位置设置好风格就可以了。
第二步：设置CalendarExtender
由于我演示了CalendarExtender的两种用法，因此设置有两种，但差别不大，具体代码如下所示：
CssClass="MyCalendar" runat="server">
runat="server" TargetControlID="TextBox2" PopupButtonID="Image1">
CalendarExtender1是最基本用法，我们直接把它的TargetControlID设为TextBox1，当TextBox1获得焦点时，CalendarExtender1就会自动展开，直到TextBox1失去焦点为止。而CalendarExtender2的用法有些特别，它比CalendarExtender1多了个PopupButtonID属性，值为Image1。它指我们可以通过点击Image1来激活CalendarExtender2控件，但选择完日期后，值还是返回到TargerControl即TextBox2那里。当选择完日期后，CalendarExtender2会自动消失。同时我们还定义了时间的显示格式，Format="yyyy-MM-dd"。
OK，运行，效果如下图：
点击TextBox1后CalendarExtender1自动展开。
点击Image1后CalendarExtender2会自动展开，选择完日期后CalendarExtender2会自动消失，并且日期的显示格式是我们所指定的格式。
结束：
本章主要介绍了CalendarExtender的使用方法。作为Ajax.net的日期控件，CalendarExtender还有很多很炫的功能，这需要大家自行研究一一发掘出来。
