The Core Concepts of HTML, CSS

  1. The Basic structure of an HTML page

  1. The DOM

    The Document Object Model (DOM) is a programming interface for HTML documents. The DOM is a tree like structured representation of a web page defined as a document. This allows programs a way to access and make changes to the document structure, style and content. The DOM provides groups of nodes and objects that have properties and methods. Essentially, it connects web page to scripts or programming languages.
  2. Elements

    • What is an Element?
    • What are child, and parents, siblings, ancestors etc…
    • Nesting
    • Attributes
      • "Name" and "Value" pairs format explained
      • html attribute "id"
      • html attribute "class"
  3. CSS

    1. Fundamental Selectors
        Example: <div id="my-id" class="my-class">content</div>
        • just the element (tag) name: div
        • "#" before the id name: #my-id
        • "." before the class name: .my-class
    2. Complex Selectors
      • Elements with one or more classes
      • Elements with class under a specific Element
      • Cascading Example
    3. Script Elements
      • Where do they go?
      • SRC attribute (for external scripts)
      • Inline scripts

Supplemental Video

Html/Css Basics

Complete and Continue