HTML

Last Updated: 9/27/2022

Cascading Style Sheets (CSS)

  • CSS stands for Cascading Style Sheets.
  • Used to style and lay out web pages
  • You can alter the font, color, size and spacing of your content, how elements are positioned and laid out, different displays for different devices and screen sizes, and much more!
  • Cascading means that a style applied to a parent element will also apply to all children elements within the parent. So, if you set the color of the body text to "blue", all headings, paragraphs, and other text elements within the body will also get the same color unless you specify something else.

Using CSS

CSS can be added to HTML documents in 3 ways:

  • Inline - by using the style attribute inside HTML elements
  • Internal - by using a <style> element in the <head> section
  • External - by using a <link> element to link to an external CSS file

Inline CSS

  • Used to apply a unique style to an element.
  • Uses the style attribute of an HTML element.

<h1 style="color:blue;">Heading 1</h1>

Internal CSS

  • Used to define a style for the page.
  • Defined in the <head> section of an HTML page, within a <style> element.
<style>
body {background-color: powderblue;}
h1   {color: blue;}
p    {color: green;}
</style>

External CSS

  • Used to define the style for many HTML pages.
  • Add a link to it in the <head> section of each HTML page

<link rel="stylesheet" href="styles.css">

Previous
Next