CodeDragon is designed to work with Google Chrome and Firefox, and a few features of CodeDragon have been found not to work properly with other web browsers. To make sure you get the best experience when using CodeDragon, please download the latest version of Google Chrome or Firefox and try again. You can install Google Chrome for free here, and Firefox here.
Or, you can continue anyway.
CSS/0
CSS stands for Cascading Style Sheets. It's a coding language that's similar in structure to HTML.
Before going on to CSS, make sure you've mastered Introduction to HTML. You can't write CSS without knowing about HTML.
Here's an example of what CSS looks like:
As with HTML, this might look complicated. It's easy to understand, but it can take a while to get used to it.
CSS is a language for adding styling to your HTML websites. The concept is simple - you need to select an element and apply a set of styling rules to it.
A rule in CSS is a style 'setting' we want to apply to something. A rule always looks like this:
It's important to remember that rules always have a semicolon (;) at the end of them.
There's quite a few properties that a rule can have. Some examples are:
color
background-color
margin
font-size
font-family
The value of a CSS rule says what that property should be set to.
If you're interested, you can read the full list of CSS properties.
Good question - CSS can go in several places.
In the 'style' attribute of an element.
In the HTML <head>, using selectors to reference elements.
In a separate .css file in the same format as in the HTML <head> , although this isn't currently supported in CodeDragon.
Using CSS with attributes is the easiest way to get started with it, because it removes a lot of complication.
Let's suppose we have a <p>, and we want to make the text be coloured green. Here's the code we'd use:
See? It makes sense - you just use the style attribute of any element, and put CSS rules inside it.
Try making this <p> a different colour. In CodeDragon, you can use a colour picker to choose colours.