Homework, resources, code snippets, live projects and learning hacks can be found in the respective day folders.
- What is HTML? What is CSS?
- Basic HTML tags
- h1, h2 etc
- p
- div
- head, body, link, img
- Self closing tags and explicitly closing tags
- Simple CSS Properties
- Margin and Padding
- Hexadecimals for colours
- Font properties like font-size, font-weight etc
- Position absolute and relative
- Inline vs Block
- Using online tools (codepen.io) to quickly get started without having new files.
- Getting fonts from Google font.
- Getting colour palettes online.
- Using ID in CSS.
- Install and use Visual Studio Code to start a project and see output for the HTML.
- Display and block properties. Everything in web design is a box.
- Using Google Chrome's Inspect Elements to make changes quickly, analyse CSS properties and understand the structure better.
- Very basics of relative linking in HTML.
- Made 2 simple pages. Broke them into parts (boxes, individual tags) and built them in class.
- Refresher display inline and block elements using inspect elements.
- Anchor tags and how to open in new tabs.
- unordered list tags.
- Centering block elements and centering inline elements.
- Span tags. Use cases and how they differ from paragraph tags.
- Why use a
reset.css
and using an existingreset.css
file. - What is mobile responsiveness?
- Mobile first approach.
- CSS breakpoints for media queries. Why those breakpoints?
- Linking to an ID in a HTML page.
- Semantic HTML
- Pseudo-Selectors (just hover) in CSS.
block
,inline
andinline-block
.- Different CSS for different width devices.
- Linking to different HTML pages using anchor tags.