Learning about CSS
Posted by editor in 
CSS stands for “Cascading Style Sheets” and are used when developing webpages and websites.
The cascading style sheets are used by html pages to define how the layout and the style of each item on the page will be displayed. The CSS file has the power to change the layout of a page and also the style of the text and where the text is positioned on the pages.
CSS is a relatively new standard or method for creating the design and layout of pages on websites.
CSS gives the designer the ability to make mass changes to a site from one file. It allows the styles / layouts / format of the site to alter with one alterations to one file. All files that are linked to this Cascading Style Sheet will be updated with the change.
Below are the main parts of a style sheet.
CSS is made up of three components and these are :
- A sector
- A Property
- A value
an example of CSS is this :- h1 {color:blue} the example shows that all H1 tags, normally seen in code as <h1> will be displayed in blue </h1>
All the H1 tags that are referenced by the attached Style sheet will have automatically been updated and now use the new blue H1 tag.
There are two main types of Items for Style sheets and these are Id’s and Classes.
A Id is used when its only going to be used the once and is seen in a style sheet by the use of a # e.g #paragraph1 this will be referenced in the html code and when called allow what ever change to paragraph1 to be implemented.
The other is a Class. This is normally defined by a . at the start of the name. This is used in situations when the request for a style is used over and over again and can be used to define a group of things to be altered. This would be ideally suited for making all cells in a table grey. A more eneric name would be given.
I.E .titles If the style was set to .titles like this <div class=”titles”>
Ways to use a css file
There are 3 ways that a css can be use in development and these are as follows
- External style sheet
- Internal style sheet
- Inline style
External style sheets are normally a seperate file that is included at the top of the page and it contains all the styles / classes / that are required for the pages that its included in.
A Internal Style Sheet contains all the information thats on a external sheet but it is included at the top of the page in the header of the html. When the page loads it includes all this information and uses it to style the page
Inline Styles are styles that are included in the html code at the point where they are needed to be used. a example of this would be <span colour=blue>Set colour to blue</span>
Simple Solutions at SimpleHQ
Our web design packages start at just £500 plus VAT. We specialise in creating websites that are easy for our customers to manage and update.
Contact us today for a quote. We offer affordable web design packages for any business.
