CSS styles

CSS styles are used to create and control the visual appearance of website pages.

Simple changes can be made to the visual appearance of your website by clicking buttons, and without you needing to know or apply any CSS styling.

However, learning about how to apply CSS styling to your website, will enable you to have complete control over the visual appearance of the site. Plus, will enable you to apply advanced features to your pages which you would otherwise be unable to easily apply.

You can start out with a pre designed website template, and then over time or immediately change and upgrade the appearance of your website to make it visually unique to align with your business concept.

This is achieved by making small changes to the CSS and by replacing graphic images either one at a time, or by changing multiple design images at once such as the website heading, navigation buttons and background, etc instantly.

You could very quickly, and easily within less than a day or even within an hour, give your website a complete makeover by creating new graphics to replace existing ones, and by making unique adjustments to CSS styles.

A site makeover can be achieved without impacting any of your existing website contents, and without your website going offline even for a second.

Many websites offer tutorials and information about using a broad range of CSS styles. Although many of the tutorials at those sites are difficult for inexperienced website owners to interpret and apply on their own websites.

The features available in SBI's BB2, such as the Site Designer window and the associated Custom CSS window, remove all of the challenges relating to editing CSS, and enable many styles and features to be edited and added to BB2 edited pages with absolute ease.

Plus, this website publishes a range of CSS driven styles, accompanied by simple explanations of how you can copy the example styles, adjust them to your own requirements, and then apply the edited styles to your own BB2 website.

Also, if you find a CCS styling function that you wish to use on your own website, although you struggle with learning how to apply that style, contact me with the relevant information.

I will figure it out for you and provide you with a solution that will work on your website pages. Plus, I will add the information to a page at this website as a resource for others BB2 users to access, and apply to their websites.

New styles continue to evolve and become increasingly sophisticated over time as the CSS standards continually evolve and change. These changes enables website owners to add more functionality to their websites, without the need to create complex html or Javascript code.

It is however, important to understand that what works well in one web browser such as Firefox, may not work perfectly in another web browser such as Safari or Internet Explorer. This is why it is always important to check the CSS you apply to a website page and ensure that the changes you have made work well when the page is viewed in different browsers.

There are ways to make most features work in all browsers, although it can take time and experience to research and learn how to overcome the differences between the various browsers. I am however, more than happy to assist you with any challenges you may encounter.

Hiding the TOC on your home page

If you want to hide the TOC titles and links on your BB2 home page. Try adding the following two lines of CSS styles code to the Custom CSS window in Site Designer.

.TOC dt {display: none;}

.TOC dd {display: none;}

These two lines of code are all that is needed to hide the table of contents from view.

After saving the change, view your home page in a regular browser window. If the above code does not achieve the results you want to achieve at your website, remove the two lines of code from the Custom CSS window and revert to the previous arrangement.

Let me know if the above code does not work on your website. I will investigate the reason and provide you with an alternative solution.

Return to the top of the CSS styles page.

Return to the website styles page.

Article by ©

Introduction videos

Handy CSS style applications

CSS Button Generator