Introduction to CSS3 + Pseudo-elements

Lectures 04 • 40 slides

Narration

Slide 1, Session 04: CSS3 Introduction + Pseudo-elements

Review of the Previous Session

  • Basic HTML5 writing
  • Document structure (DOCTYPE, html, head, body)
  • Semantic markup (header, nav, main, article, section, footer)

Today's Theme

CSS3 Basics and Decoration Techniques with Pseudo-elements

mindmap root((CSS3 Introduction)) HTML Review Document Structure Semantic CSS Basics Basic Syntax Selectors Color/Background/Font transition/transform Pseudo-elements ::before / ::after content property ::first-line ::first-letter Decoration Techniques

What is CSS?

  • Cascading Style Sheets
  • A language for defining the appearance of web pages
  • HTML is "what", CSS is "how"

Learning Content for this Session (First Half)

  • Basic CSS syntax and writing methods
  • Types of selectors and how to use them properly
  • Setting colors, backgrounds, and fonts
  • Utilizing transition and transform

Learning Content for this Session (Second Half)

  • Pseudo-elements (::before / ::after)
  • Utilizing the content property
  • ::first-line and ::first-letter
  • Decoration techniques using pseudo-elements
1/40

Apps - Try Now

SaaS web services and mobile apps from Yamashin Research Lab.

View Apps