What is CSS?! Reading Notes

CSS Cascading style sheets allow you to create webpages that are stylized!

What is CSS Used for?

CSS can be used for very basic document styling.

Examples

• Color

• Text

• Layouts

Sample Code Below!

h1 {

color: red;


font-size: 5em;
}

Utilizes curly braces and itemized categories.

The braces have declarations within them and form a property and value pair.

CSS Specifications

CSS is are defined in documents called specifications and are standardized by the follow organizations. They defined how the language interacts with other languages

• W3C

• WHATWG

• ECMA

• Khronos

Ways to Insert CSS?

There are 3 ways!

• External CSS

• Internal CSS

• Inline CSS

External CSS

With an external style sheet, you can change the look of an entire website by changing just one file!

h1 {

color: navy;

}

They must be saved with a .css file tag

Internal CSS

An internal style sheet may be used if one single HTML page has a unique style.

The internal style is defined inside the style element, inside the head section.

Inline CSS

An inline style may be used to apply a unique style for a single element.

To use inline styles, add the style attribute to the relevant element. The style attribute can contain any CSS property.

Cascading Order?

There is a priority if you happen to use more than one kind of CSS format.

1. Inline (within HTML) 2.External and Internal Style sheets in the Head
2. Browser Default!

CSS Color types?

Heres the different type of color values along with the examples of how they are written out!

• HEX Value: #92a8d1

• RGB Value: color: rgb(201, 76, 76

• RGBA Value: color: rgba(201, 76, 76, 0.6);

• HSL Value: color: hsl(89, 43%, 51%);

• HSLA Value: color: hsla(89, 43%, 51%, 0.6);

Back to Home