CSS stands for Cascading Style Sheets. A web page consists of two basic components - the content (or information you wish to display) and the style (the way in which you wish the content to be displayed). CSS controls the style (presentation) of your pages.
The syntax of CSS syntax is made up of three parts:
The way in which these are used is:
selector {
property: value;
}
For example, to set a black background on a div with the class "foo", you would use:
.foo {
background: #000;
}
You can also group selectors by separating them with commas. In the example below, all the HTML header elements have been defined as white:
h1, h2, h3, h4, h5, h6 {
color: #fff;
}
You don't have to have each selector on a separate line but it does increase readability and is considered best practice in WordPress. Exampl
.foo,
h1,
h2,
.exampleclass,
#exampleid {
background: #000;
color: #fff;
}
The CSS in your chosen theme will probably be in the theme's style.css file. This file can be found in the theme's folder and can also be accessed via the Theme Editor. Where a theme has split its CSS across multiple .css files, these, too, may be available via the Theme Editor.
The exception to this rule is when theme authors have placed their .css files in a sub-folder. In these situations, you will not be able to access the file via the Theme Editor. You will need to use FTP or whatever file management application your host provides instead. The files will need to be downloaded, edited using a plain text editor and then re-uploaded to the theme's sub-folder.
Whichever way you chose to edit your theme's CSS, do remember to backup the files you are working on so that you can revert to a previously working copy if necessary.
The stylesheet(s) associated with a plugin will be stored in that plugin's folder and may be accessed via the Plugin Editor. Whichever way you chose to edit your theme's CSS, do remember to backup the files you are working on so that you can revert to a previously working copy if necessary.
There are many online resources that you can use to learn about CSS. These are just a few of them:
The following tools allow you to allows you to test, debug and create CSS in any web page.