Styling

This sample illustrates that the calendar has different CSS skins
CSS Skins:

Source
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxcalendar.css">
<link rel="STYLESHEET" type="text/css" href="../../codebase/skins/dhtmlxcalendar_classic.css">
<link rel="STYLESHEET" type="text/css" href="../../codebase/skins/dhtmlxcalendar_dhx_black.css">
<link rel="STYLESHEET" type="text/css" href="../../codebase/skins/dhtmlxcalendar_dhx_blue.css">
<link rel="STYLESHEET" type="text/css" href="../../codebase/skins/dhtmlxcalendar_dhx_skyblue.css">
<link rel="STYLESHEET" type="text/css" href="../../codebase/skins/dhtmlxcalendar_simpleblue.css">
<link rel="STYLESHEET" type="text/css" href="../../codebase/skins/dhtmlxcalendar_simplecolordark.css">
<link rel="STYLESHEET" type="text/css" href="../../codebase/skins/dhtmlxcalendar_simplecolorsand.css">
<link rel="STYLESHEET" type="text/css" href="../../codebase/skins/dhtmlxcalendar_simplegrey.css">
<link rel="STYLESHEET" type="text/css" href="../../codebase/skins/dhtmlxcalendar_vista.css">
<link rel="STYLESHEET" type="text/css" href="../../codebase/skins/dhtmlxcalendar_yahoolike.css">
<script>window.dhx_globalImgPath = "../../codebase/imgs/";</script>
<script  src="../../codebase/dhtmlxcommon.js"></script>
<script  src="../../codebase/dhtmlxcalendar.js"></script>
 
<script>var mCal;
 
window.onload = function() {
    mCal = new dhtmlxCalendarObject('dhtmlxCalendar', true, {
        isWinHeader: true,
        isWinDrag: false
    });
}</script>
 
 
<table border="0"  cellpadding="5" cellspacing="3">
  <tr>
<td valign="top"><div id="dhtmlxCalendar"></div></td>
<td valign="top" align="center">
    <h3>CSS Skins:</h3>
    <select name="cssName" id="skinSelect" onChange="mCal.setSkin(this.value);">
        <option value="" selected >= default =</option>
        <option value="yahoolike">Yahoo like</option>
        <option value="simplegrey">Simple gray</option>
        <option value="simpleblue">Simple blue</option>
        <option value="vista">Windows Vista</option>            
        <option value="simplecolordark">Simple color dark</option>
        <option value="simplecolorsand">Simple color sand</option>
        <option value="classic">Classic</option>                                
        <option value="dhx_blue">Dhx Blue</option>
        <option value="dhx_black">Dhx Black</option>
        <option value="dhx_skyblue">Dhx Skyblue</option>
    </select>
</td>
  <tr>
  </tr>
</table>
<br>