Click on the link for each tutorial below. Follow the instructions in the README.md. Use the walkthrough video to help with understanding and carrying out instructions.
- non semantic tags: div and span
- semantic tags: p, nav, header, footer, asside, section, article
- CSS: Inheritance and Specificity
Video- Adding styles
- inheritance and specificity
- selectors
- properties and values
- cascading: inline, internal, external (link with href)
- Box Model: margin, padding, borderer, normalizing
Video- tags with out closing tag (img, link)
- box-model
- text-align
- margin: auto
- border-sizing
- CSS shortcuts
- Layout-horizontal
Video- horizontal alignment
- using lists
- inline vs block elements (span, div, p, ...)
- floating list items
- display list items with inline block
- float : left, float: right
- display:inline, display: inline-block
- Layout-2D
Video- 2 dimensional alignment
- display ( table, row, col)
- display: table
- table-layout: fixed
- border-collapse
- border-spacing
- table-row, table-cell
- position (relative, absolute, fixed, static)
- Image Float Text
Video- default inline and block
- floating text next to
- figure
- attributes (src, alt)
- background images
- Web Linking
Video- paths: relative, root relative and absolute
- anchors (links): internal, external linking, default style, hover
- link, visited, hover, active
- text-decoration
- href
- Fonts and Text
Video- google fonts
- font size
- line height
- letter spacing
- text transform
- color
- background-color
HTML Elements
HTML Attributes
Styling with CSS
HTML Colors
HTML Comments
HTML Headings
HTML Paragraphs
HTML links
HTML Lists
Block and Inline Elements
HTML Class Attribute
HTML ID Attribute
HTML Entities
HTML Layouts
CSS Navbar
CSS Anchor Tag Styling
CSS Float
HTML Image Tag
CSS Table Layout
HTML Elements Reference
CSS: Cascading Style Sheets
CSS Reference