<SfSchedule TValue="AppointmentData" Height="650px" @bind-SelectedDate="@CurrentDate" CssClass="customize-schedule"> <ScheduleEventSettings DataSource="@DataSource"></ScheduleEventSettings>
<ScheduleViews>
<ScheduleView Option="View.Day"></ScheduleView>
<ScheduleView Option="View.Week"></ScheduleView>
<ScheduleView Option="View.WorkWeek"></ScheduleView>
<ScheduleView Option="View.Month"></ScheduleView>
<ScheduleView Option="View.Agenda"></ScheduleView>
</ScheduleViews>
</SfSchedule> <style> .customize-schedule.e-schedule {
background-image: url("https://blazor.syncfusion.com/demos/_content/blazor_server_common_net7/images/carousel/bridge.png")
}
.customize-schedule.e-schedule,
.customize-schedule.e-schedule .e-schedule-toolbar-container .e-schedule-toolbar.e-toolbar,
.customize-schedule.e-schedule .e-schedule-toolbar-container .e-schedule-toolbar.e-toolbar .e-toolbar-items,
.customize-schedule.e-schedule .e-vertical-view .e-date-header-wrap .e-all-day-cells,
.customize-schedule.e-schedule .e-vertical-view .e-date-header-wrap table tbody td,
.customize-schedule.e-schedule .e-vertical-view .e-work-cells,
.customize-schedule.e-schedule .e-vertical-view .e-work-hours,
.customize-schedule.e-schedule .e-vertical-view .e-time-cells-wrap table td,
.customize-schedule.e-schedule .e-vertical-view .e-left-indent-wrap table tbody td {
background-color: transparent;
}
</style> 
