Course: Study / Web Design and Web Development, Topic: Module01: Advanced HTML and CSS

Topic outline

General

Collapse all Expand all

Module01: Advanced HTML and CSS
Selectors. Table-HTML. Table-CSS. Div - Span elements

Selectors

Table-HTML

Table-CSS

Div - Span elements

Selectors. In this submodule, we will learn how to use CSS selectors to "find" and select HTML elements based on their name, id and class. We also learn to apply CSS rules to multiple classes and to specific content in a list.

Table-HTML. Tables are used very often. We use them to display visually data organized in rows and columns. In this submodule and we will learn how to use HTML markup to construct a table.

Table-CSS. In this submodule, we will learn how to use CSS rules, and classes to apply different style to various elements of a table.

Div - Span elements. In this submodule, we will learn how to use the block element DIV and the inline element Span. Also, we will learn how to align elements next to each other using the properties float and clear.
- Please, create a folder called yourNameWEB2 on the Desktop of your computer.
  
  In the folder yourNameWEB2, create a new subfolder advanced.
- Page
  
  The Browser and the Visual Studio code editor Page
  
  The Visual Studio code editor is installed into the lab's computers
- Page
  
  Aims - Expected outcomes- Key concepts Advanced HTML and CSS Page
- Book
  
  Submodule 1.1: Selectors Book
  
  View
  id
  
  Class and multiple classes
  
  specific context (ul li)
  
  Group the selectors
- Book
  
  Submodule 1.2: HTML on Tables Book
  
  View
  The elements of a table
  
  Construction of a table
- Book
  
  Submodule 1.3: CSS on tables Book
  
  View
  Style properties
  
  Class rules
- Book
  
  Submodule 1.4: More elements Book
  div element
  
  span element
- Please, familiarize with the HTML and CSS validators to be sure that your code is correct every time! You can also install the HTMLhint extension in your Visual Studio code editor to help you.

Topic outline

General

Module01: Advanced HTML and CSS

Selectors. Table-HTML. Table-CSS. Div - Span elements