Adding Colour to your Webpages

Colour schemes. The pages start off with a white main background and white table background. Now it's time to be creative and colour the pages in!

You may want a different colour scheme for each page and there are two areas in which you can change the background colour.

For the whole page - you do this in the Properties Window/Page Properties.

For the table rows - you do this in the floating Properties Window, in the Bg colour selection box. If the box is not showing, on the left side select the HTML tag Then click inside the table and select a colour from the colours palette.

Find a suitable colour each page background using the floating Properties Window. (Windows/Properties - if not already open).

Select the main page background outside the table and then select Page Properties. The following dialogue window will appear.

Make the changes as follows, excepting the background colour, which you need to choose yourself. Though you can choose your own background colour. You also need to change the font, as well as the margins.


Table Row colouring.
Having changed the main background, select the CSS tag (under the Properties name - on the left) and select each table row and use the Bg Colour square and change the background of each row. If you are selecting the same colour for each table row, then copy/paste the colour number (including the # hash tag).

You could also use different colours for each row or some of the rows. Use the Bg colour square to bring out the colours and then select the one you want.

If you decide to select a dark colour for the table row backgrounds, you will have to change the text colour from the default black.

To do this go to the the floating Properties window and then Page Properties and select a text colour using the colour selection box. This will change the text colour for the whole page.

If you need to change the text (font) colour for one/some table rows, select the text within the table row and then using the CSS Tag option instead of the default HTML option, then use the far right colour window. See below.

You could also put an image into the main page background. But care must be taken, to ensure the image is big enough!

The background image needs to be really large - more than 1280px wide (but not too large) and of very high quality.

Though with an image as the background, it will only be partially seen.

In the table text content area, the background has to be a solid fill so the text can be easily read. See the example below.

Above is an example of part of the Index Page with a coloured background and the Index Page with a background image and table cells coloured in. The choice is yours!

Find Images & Resize

Build the Pages

Building the Music Page

Hyperlinking Images and Sounds

Add Some Colour

Webpage Layout
Examples

Index

 

.