Styling your site using CSS and SassSite designer
When your HTML grid has been set up and configured using layout blocks, all the remaining styling and design is done using three complementary parts of the TwentyThree design engine:
- CSS (or Cascading Style Sheets) lets you style any element on any page by setting position, colors, fonts, border, padding and much more. In addition to standard CSS, TwentyThree supports the Sass extension to CSS. This included the option of using variables, intuitive nesting of style declarations and more.
- Files is where you upload resource files needed for your design. These will usually be small graphics files such as logos or backgrounds, but you can upload any file type including ZIPs, PDFs and stand-alone CSS files.
Cascading Style Sheets is an integral part of all web development, and is used for transforming the markup in HTML into well designed websites. If you want to learn more about CSS, Mozilla's reference is a good place to start.
When you want to set up your own design for TwentyThree, you will be using CSS to change the look and formatting of the overall grid of pages.
TwentyThree supports the writing of style rules in Sass as well as CSS. Sass is an extension to normal CSS that allows for the implementation of more advanced styling rules such as the use of variables, nested style rules, re-usable styles through mixins and control directives and expressions such as if, for and each. All of this allows developers to write styles that minimise redundancy and are easier to maintain.