Lecture Notes
Cascading Style Sheets
❖ CSS stands for Cascading Style Sheets.
❖ CSS describe how HTML elements are to be displayed on screen,
paper, or in other media.
❖ CSS saves a lot of work. It can control the layout of multiple
web pages all at once.
❖ External stylesheet are stored in CSS files.
Basic CSS Structure
Properties
Box
▪ Color
▪ Model
▪ Background Color
▪ Padding
▪ Font Family
▪ Border
▪ Icons
▪ Margin
▪ Content Positioning
Cascading & Inheritance
▪ Static
▪ Value & units
▪ Relative
▪ CSS Specificity &
Inheritance
▪ Absolute
▪ Fixed
Display
▪ Sticky
▪ Block
Flex Box
▪ Flex-direction
▪ Flex-wrap
▪ Flex-start
Grid
▪ Inline-block
▪ Inline
▪ Table
▪ Flex
▪ Grid
Preprocessor
▪ Grid template columns
▪ SASS
▪ Gap
▪ LESS
▪ Column-gap
▪ ProsCSS
▪ Row-gap Practice CSS
❑ CodeWell
❑ Frontend Mentor
❑ CSSBattle
❑ Practicy
❑ CodeByte
❑ Ace FrontEnd
❑ CodePen Challenges
Learn CSS
❑ Sololearn
❑ Position is everything
❑ The Odin Projects
❑ HTML dog
❑ Reddit
❑ CSS Zen Garden
❑ CSS Tricks
❑ CSS at MaxDesign
❑ CSS help pile
❑ CSS discuss
❑ CSS basics
❑ CSS on delicious
❑ Holy CSS zeldman
❑ A list apart CSS topics CSS Cheat Sheet
Background