RealGrid2 Style

RealGrid2 style, unlike previous versions of RealGrid, provides styles in almost all areas in the form of classes according to the rules of CSS (opens in a new tab), a standard style sheet language.

Default style

RealGrid2 package comes with default styles and theme styles. Default styles are defined in the realgrid-style.css file included in the package. If there is no style file, the grid will not be displayed properly as shown in the demo screen below.

Grid with style files removed

If you comment out the style file like the code below, you will see that the shape of the grid is not recognizable and only the data is output.

<!-- RealGrid -->
<!-- <link href="/public/realgrid.2.0.2/realgrid-style.css" rel="stylesheet" /> -->
<script src="/public/realgrid.2.0.2/realgrid-lic.js"></script>
<script src="/public/realgrid.2.0.2/realgrid.2.0.2.min.js"></script>

Grid with style file applied

This time, let's uncomment the style file and apply the default style.

<!-- RealGrid -->
<link href="/public/realgrid.2.0.2/realgrid-style.css" rel="stylesheet" />
<script src="/public/realgrid.2.0.2/realgrid-lic.js"></script>
<script src="/public/realgrid.2.0.2/realgrid.2.0.2.min.js"></script>

User Style

RealGrid2 allows you to create custom styles using classes specified in the default style.

For a detailed description of the main classes of custom styles, please refer to the User Style Guide.