Вы можете использовать следующие селекторы:
Просмотры:
.k-scheduler-views .k-link { // For all the views
background: blue;
}
.k-view-day .k-link { // For day view only
background: blue;
}
.k-view-week .k-link { // For week view only
background: blue;
}
.k-view-month .k-link { // month-view-only
background: blue;
}
Навигация по дате:
.k-scheduler-navigation .k-link { // For all date navigation controls, including arrows, "Today" and the date picker
background: blue;
}
.k-nav-today .k-link { // For the "Today" button only
background: blue;
}
.k-nav-prev .k-link { // For the previous arrow only
background: blue;
}
.k-nav-next .k-link { // For the next arrow only
background: blue;
}
.k-nav-current .k-link { // For the date picker only
background: blue;
}
Обратите внимание, что вы можете найти все эти селекторы вВкладка «Элементы» в Dev Tools любого браузера.
Посмотрите приведенный ниже фрагмент.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Kendo UI Snippet</title>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2018.3.1017/styles/kendo.common.min.css"/>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2018.3.1017/styles/kendo.rtl.min.css"/>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2018.3.1017/styles/kendo.silver.min.css"/>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2018.3.1017/styles/kendo.mobile.all.min.css"/>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2018.3.1017/js/kendo.all.min.js"></script>
<style>
.k-scheduler-navigation .k-link {
background: blue;
}
.k-nav-today .k-link {
background: green;
}
.k-nav-prev .k-link {
background: red;
}
.k-nav-next .k-link {
background: yellow;
}
.k-nav-current .k-link {
background: cyan;
}
.k-scheduler-views .k-link {
background: blue;
}
.k-view-day .k-link {
background: green;
}
.k-view-week .k-link {
background: red;
}
.k-view-month .k-link {
background: yellow;
}
</style>
</head>
<body>
<div id="scheduler"></div>
<script>
$("#scheduler").kendoScheduler({
date: new Date("2013/6/6"),
views: ["day", "week", "month", "agenda"],
dataSource: [
{
id: 1,
start: new Date("2013/6/6 08:00 AM"),
end: new Date("2013/6/6 09:00 AM"),
title: "Interview"
},
{
id: 2,
start: new Date("2013/6/6 08:00 AM"),
end: new Date("2013/6/6 09:00 AM"),
title: "Meeting"
}
]
});
</script>
</body>
</html>