The style sheets feature in 4D allows you to style forms via CSS. By default, 4D gives you three style sheets that the program can inherently work with:

• styleSheets.css


• styleSheets_mac.css


• styleSheets_windows.css

The first style sheet is a general one that applies styling onto form elements on both Mac and Windows platforms, while the second and third documents apply to their corresponding platform.

While it is possible to apply CSS styling with just these three files, they can become quite long and monolithic, especially in larger databases. For better organization, it is possible to split CSS code among multiple style sheets using the @import tag.

The implementation is easy as it only involves two steps:

1. Create a CSS file with the code you would like to encapsulate somewhere on the database folder. You may name this anything you would like, other than the names of the three default style sheets.


2. In the default style sheet, include the @import tag with the relative path to the additional style sheet you just created. There are two ways to write this:
   
   
   
   • @import url({add relative path here});
   
   
   • @import "{add relative path here}";

Once the files are saved on the disk, 4D will automatically detect the changes and apply them to the forms; with 4D's CSS preview feature, you can view the styling through the form editor.