0% found this document useful (0 votes)
1 views2 pages

intro-to-html-and-css-syllabus

Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
Download as pdf or txt
0% found this document useful (0 votes)
1 views2 pages

intro-to-html-and-css-syllabus

Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
Download as pdf or txt
Download as pdf or txt
You are on page 1/ 2

Intro to HTML & CSS

Learn the basics of HTML, including syntax and formatting, in this hands-on introductory
COURSE SYLLABUS

class. You'll also explore CSS and its various selectors and how to use browser developer
tools and validate your HTML code.

Group classes in NYC and onsite training is available for this course.
For more information, email hello@nobledesktop.com or visit:
https://www.nobledesktop.com/classes/html-intro

hello@nobledesktop.com • (212) 226-4149

Course Outline

Section 1
Coding Basics: Intro to HTML Syntax
The HTML, head, title, & body tags
Headings, paragraphs, & lists
The strong & em tags
The doctype
The lang attribute
The meta tag & the unicode character set

Coding Links: Absolute & Relative URLs


Anchor tags & hrefs
Linking to other websites
Linking to pages within a website
Opening a link in a new browser window/tab

Adding Images
The break tag
The image tag & source attribute
Using the width, height, & alt attributes
Using horizontal rules

Intro to Cascading Style Sheets (CSS)


The style tag
Tag selectors
The font-size, font-family, color, & line-height properties
Hexadecimal color codes

Course Syllabus | Intro to HTML & CSS 1


Section 2
CSS Class Selectors
The class attribute
CSS class selectors
The span tag
CSS opacity

Div Tags, ID Selectors, & Basic Page Formatting


Dividing up content with the div tag
Assigning IDs to divs
Setting width & max-width
CSS background-color
Adding padding inside a div
Centering content
CSS borders
CSS shorthand & the DRY principle

Using Browser Developer Tools


Opening the DevTools in Chrome
Editing HTML in the DevTools Elements panel
Enabling, disabling, & editing CSS in the DevTools
Using DevTools to fine-tune your CSS
Hexadecimal shorthand

HTML5 Semantic Elements & Validating HTML


The outline algorithm
The header, nav, aside, & footer elements
Understanding articles & sections
The main element
The figure & figcaption elements
Checking for errors: validating your code

Course Syllabus | Intro to HTML & CSS 2

You might also like