CSS Intro

CSS Intro Quiz

CSS Intro Exercise

CSS Basic

CSS Basic Quiz

CSS Basic Exercise

CSS Advance

CSS Advance Quiz

CSS Advance Exercise


CSS3 Quiz

CSS3 Exercise

CSS Properties

CSS Functions

CSS Selectors

CSS Basic

List of CSS Basic

CSS Syntax
CSS is composed of style rules that the browser interprets and then applies to the corresponding elements in your document. A style rule has three parts: selector, property, and value.
ID and CLASS Selectors
id selectors allow you to style an HTML element that has an id attribute, regardless of their position in the document tree. Class selectors work in a similar way.
Descendant Selectors
Descendant Selectors are used to select elements that are descendants of another element. When selecting levels, you can select as many levels deep as you need to.
Comments in CSS are used to explain your code, and may help you when you edit the source code later. Comments are ignored by browsers.
Inheritance refers to the way properties flow through the page. A child element will usually take on the characteristics of the parent element unless otherwise defined.
Font Family
The font-family property specifies the font for an element. There are two types of font family names: - font family - generic family
Font Size
The font-size property sets the size of a font. One way to set the size of fonts on the web is to use keywords. For example xx-small, small, medium, large, larger, etc.
Font Style
The font-style property is typically used to specify different styles like italic text
Font Weight
The font-weight controls the boldness or thickness of the text. The values can be set as normal (default size), bold, bolder, and lighter.
Font Variant
The CSS font-variant property allows you to convert your font to all small caps. The values can be set as normal, small-caps, and inherit.
The CSS color property specifies the color of the text.
Text Align
The text-align property specifies the horizontal alignment of text in an element. By default, text on your website is aligned to the left. However, at times you may require a different alignment.
Vertical Text Align
The vertical-align property sets an element's vertical alignment. Commonly used values are top, middle, and bottom.
Text Decoration
The text-decoration property specifies how the text will be decorated.
Text Indent
The text-indent property specifies how much horizontal space should be left before the beginning of the first line of the text.
Text Shadow
The text-shadow property adds shadow to text. It takes four values: the first value defines the distance of the shadow in the x (horizontal) direction, the second value sets the distance in the y (vertical) direction, the third value defines the blur of the shadow, and the fourth value sets the color.
Text Transform
The text-transform CSS property specifies how to capitalize an element's text. For example, it can be used to make text appear with each word capitalized.
Letter Spacing
The letter-spacing property specifies the space between characters in a text.
Word Spacing
The word-spacing property specifies the space between words in a text. Just like the letter-spacing property, you can set the word-spacing values as normal, length, and inherit.
White Spacing
The white-space property specifies how white-space inside an element is handled. The values can be set as normal, inherit, nowrap, etc.