First before we get started with CSS, review Basic HTML tags. One thing you want to remember is HTML tags are pre-defined, but you can give any ID or Class to a HTML tag. Now let’s learn some CSS!
1. What is CSS?
CSS is Cascading Style Sheet. It defines how html elements look like, including color, position, size, etc.
2. CSS Syntax
For example, when we want to define the text color, we can say in our body section (which is the <body> in html), we want color to be black:
We can give a selector more than one property, and each property has a value. For example, in addition to the text color, I want my web page has a background color:
We can also define multiple selectors at a time. For example, all the h tags:
3. Defining an ID
In addition to defining html tags, we can also define ID. Let’s say we have a paragraph, and the id of the paragraph is “post”. The html would be something like this:
To define the style of an ID, for the css selector, we use a pound sign and the ID:
4. Defining a Class
In addition to ID, we can give html tags a “class”. The difference between an ID and a class is an ID is unique and a class can be used many times. Let’s say we have a paragraph with the class “left”.
To define the style of a class, for the css selector, we use a dot and the name of the class:
5. More on CSS