← All CoursesStart Learning — Chapter 1.1 →
CSS Course · Free · Beginner
CSS Hyderabad Style
Oka Free Course
Learn CSS — start from selectors, reach animations.
23 chapters + 4 real projects. Style your website directly, Hyderabadi style.
23Chapters
4Projects
4Badges
FreeForever
Stage 1
Chai pe Charcha
Basics○1.1
What is CSS & How to Add ItIrani chai spices — inline, internal, external
8 min→○1.2Selectors & SpecificityAuto stand numbering — who wins the rule game
12 min→○1.3Colors & BackgroundsCharminar colors — hex, rgb, gradients
10 min→○1.4Typography & FontsAdvanced font techniques: sizes, weights, spacing, alignment & Google Fonts mastery
10 min→○1.5Box ModelBiryani box — margin, padding, border explained
9 min→○1.6Display & VisibilityShow or hide — block, inline, none, flex
9 min→○1.7PositioningCharminar map — relative, absolute, fixed, sticky
12 min→Chai StylistCSS basics mastered — now your pages will come alive with color!
Stage 2
Biryani Layer Level
Layout○2.1
PositioningCharminar map — relative, absolute, fixed, sticky
15 min→○2.2Flexbox BasicsAuto stand line — direction, justify, align
20 min→○2.3Flexbox AdvancedBiryani serving order — wrap, gap, flex-grow
25 min→○2.4CSS Grid BasicsHussain Sagar grid — rows, columns, tracks
25 min→○2.5CSS Grid AdvancedParadise seating — areas, spanning, auto-fill
30 min→○2.6Responsive DesignMobile to desktop — media queries, breakpoints
20 min→Layout NawabLayout mastered — perfectly layered pages like biryani!
Stage 3
Charminar Shine Level
Polish🔒3.1
Shadows & Border EffectsCharminar silhouette — box-shadow, border-radius
Login to unlock10 min→🔒3.2TransitionsSmooth chai pouring — hover effects
Login to unlock10 min→🔒3.3TransformsRotate, scale, translate — 3D magic
Login to unlock12 min→🔒3.4Animations & KeyframesNizam clock — @keyframes & animation properties
Login to unlock14 min→🔒3.5CSS VariablesBiryani recipe variables — custom properties reuse
Login to unlock11 min→🔒3.6Pseudo-classes & Pseudo-elementsInvisible spices — ::before, ::after, :nth-child
Login to unlock13 min→🔒3.7CSS Functionscalc, clamp, min, max — smart sizing magic
Login to unlock12 min→Nizam DesignerAnimations, variables, pseudo-magic — you are now a true CSS master!
Stage 4
Hitech City Level
Projects🔒P1
Restaurant Menu PageParadise-style styled menu — full CSS makeover
Login to unlock45 min→🔒P2Chai Shop Landing PageComplete chai shop website — hero to footer
Login to unlock60 min→🔒P3IT PortfolioGachibowli fresher portfolio — interview ready
Login to unlock75 min→🔒P4Food BlogMulti-section food blog — biryani to haleem
Login to unlock90 min→Hitech City CSS DevBuilt 4 complete projects — ready for Gachibowli offices!
Irani Chai Style Teaching
CSS rules ko chai ki tarah simple rakhte hain. Ek selector, ek property — perfect result. Koi complex magic nahi bhai.
100% Visual Examples
Charminar ke colors, Paradise menu typography, Gachibowli office layouts. Real examples — seedha samajh aata hai.
Live CSS Playground
Har chapter mein code likho aur real-time result dekho. Sirf padhna nahi — style karna bhi padega. Lo kar liya!