Have you ever looked at the layout or your form/application and wonder how you can make it better suit your needs? You can change it! You can make a great many changes by tweaking the CSS of an object.
There are 3 ways to change the look of your application:
- Use the Style/Theme Editor, it enables you to make style changes without the need to understand or write CSS. Click the Style tab, select a theme and then click Customize to change how it looks. Changes will be applied to all forms within the application. This should be the first place you look to make style changes.
- Add a .css file to the application. Changes will be applied to all forms within the application.You may define any CSS class or override existing classes to completely customize the look of your forms. To add a file, click on the Settings tab, click Files, click the Add button, and select the file (either local or on the internet). Make sure you select the css file in the Custom CSS dropdown on the Style tab, otherwise the styles will not be usable. Note: an application may only have one .css file and it must be selected on the Style tab for the classes to be applied.
You must add the class name to the Custom CSS class names property of any item where you want the style to be applied. Add an HTML item and define the style directly. This approach will only apply the style to the form where it is defined.
Code Block language js title Define style directly within an HTML area <style> .lfMn.lotusui30 .lotusBanner { display:none; } .lfMn.lfSingleFormArea .lfFormTitleBar { display:none; } </style>
This page is dedicated to the types of changes that I have seen and that you might want to use in your own applications. Don't forget to check out our documentation on Creating Custom Styles to better understand how the forms are structured and all of the CSS classes that you may override.
Table of Contents
- How to reference application-embedded images in your CSS
- Center Checkbox with other fields on the same line
- Center Image
- Dynamically Change the Background Color of a Field
- 461181295276
- Change Heading, Tab, and Table Row Color (Center table text)
- Format List Choices into Columns
- Move Labels to the left of the Fields
- Change The Color of a Field Label
- Convert Web Link object to look like a button
- Custom Fonts
- Hide Banner and Toolbar
- Using Text Items for Navigation
- How to Use Google Fonts
- Right Align Number Fields
- Change Mouse Pointer
...
CSS provides several different ways to change the mouse pointer. Check out W3Schools to see all the available cursor styles. A common technique is to change the mouse pointer to the hourglass if a service is executing.
...