Advanced Style Options

Caspio Bridge provides advanced styling options to users who are comfortable working with CSS (Cascading Style Sheets).

To access these options, check Show Advanced Options (CSS Source) on the first screen of the Style Wizard. The following becomes available to you:

Clear All Button

Clicking the Clear All button removes all attributes from the Style's CSS classes. Clicking the Clear All button and saving the "blank" Style will allow you to create your own Caspio Bridge CSS rules on your website to control the look and feel of your DataPages.

This option is also useful when you want to design the entire Style from scratch. Click the Clear All button and go to the Source tab to add any attributes you desire under the provided class names.

Source Tab

The Source tab allows you to edit the underlying CSS classes of each of the DataPage Element Types. Classes are grouped the same way as DataPage element types on the Settings tab. Selecting the All category lists all available classes.

Working directly with the CSS source provides you with enormous styling flexibility. You can edit the existing attribute values and add any new attributes to predefined classes. Any changes you make are immediately reflected in Preview and your applied DataPages.

Adding Your Own Styles

User-defined styles are a convenient way to store custom styling you want applied to your DataPages. To add a custom class, simply enter the class name and attributes in the Source area. Caspio Bridge will automatically place the class in the User-Defined Styles category.

Styling Input Controls Individually

Each of the input controls (fields and buttons) has a unique ID that can be used to apply specific styling to the control.

To apply individual styling to a particular control, enter its style definition in the Source area using the following notation:

To look up the control's ID, view the source code of your DataPage.