---- PD $ Even) P clement inside Aide element Irreapedjrve of _Wwheathty jr is divect alement or not get nay 2uyleL Colored Pf Color £ blue: arkicle > Colored $ Coloy! blue! every PelemeaF tag Clemenie wit Cage cotoved gers “ye evesy element havj Class eolored Gnd erste ArH Ue om cree shit gers, Sane adjacent Sibling is~ Aemenk NeXF fo S- e}ernent——| vouva = Pseudo -Class Selectors = || celecter Pseude-class | rape ty S yates | Selector ave thassen according ta ville Sttidi-ed) S Jia = g) visited = Tf element visited TE mouse hover$ overt +S ee _ |3) hover = —|dacive - If Mouse cick on ft but nok realeseel 4 bth-child (x) - Peroux level of childs of demeh) Sejeated t£ element is_a link Engi 1) as hover _{ color: reds hove ting dvey link in a gives ved colour to (+ 2) Pibover, a ? acHve} | ‘ Colors Ved 5 hovering Over Pparagsaph and el HENS ox | Charges tan fe Fes) -Property: values +) | Ficst =line_- tt spyles _icst_ine of element only Pit first-line 7 3 _ 2) | Gict= letter — re stiles fitst_lerter_of_elemsenk Pe fick stetkeet - 2)| before = 14 1S used to insert something fefaxe sé SS ‘ t D PY ibetere , - content,” Url (Smiley. af); - - [ S Coley; red; : ls een ennapb L eg. a Ctarget = “blank ’) f barkground=color yellod s : } Tt ces Unt having [blany asftorach aitvibudea ith, background cslo¥ Yellow + FercmorS element Larninure v="Value" ( eithe ve "Ftower | When Hower is one word inside title element [ atte |=Wolue" | a ( title le"Fower | | wen title Stash tain Beane Je) separated lower word ee +L aera bay A= Nulue| Cc Atle Az WHowertt) wren tite stay ualily Hower wad flower MAY Net b&5y elersen} ie title = “flower! | a I CHre k= Hower —E utnen Rousse urend actured connate Uike to el bal | mos nok be _segmaied ay space ond ite | _yeder S| is 4itle — eaa Stule pl lace ment. | style can placed in Flemenis.. Ctnline or een ee - ZLeement Style = "Property 3 Values”>

Overline + underline 5 line-tniough} text ushich is not link slhauid not be Underline it creates confiition: Tout pransform. | text — transform : uppercases lowercase 5 CAPITOL 2ey Text Spacicg texr-spacing letter - Spacing word - Spocin ~ | ine =neight - a Tent Shadow) ~~} tear= shadow ———— oo Leatieentldl “dete twine vaeas oEonts = \ - \ firct fort is not Supported then Next’ fon} — S of brawsey 4 Commas are used ta duote thenn Udo start with font we won} we male ity class name ~~ 29° = cent } ~ font-family : “Times New Roman’ , Times. & 3 g mall = font style font-style. norma) 5 ty italic 4 = ahlique’ : _ EeoF welain: at-welght 2 Moxa) _s bold_; - _ Joo ; Roldness sevel [loc-— = - in muuipke of und — —— a Feot_gize - + font-size i xX px MX px = - ‘xem; j| X is vrelaHve te dF | a aia § We ic clefaubt ahd vwGooge = the link of doode fonrs ‘inserxed and _ then font Family is Ue. ="chylesheel” hyef = bite. fonts goodea pict css.@ family 2 5 Lio! | font=famiy "sofia! Font Pro perly Shhartlhane Font : italics mall aps; old 3 \29x 5 GEOTGIN, SOMES eOWCINACE Fon t= Style. font = varianh for - ae fent- farily aaacks but other yan Hoi Swe need . ied according 4o_acHyitied -f_Matise, —aniink € seumistted ink — —einner thes ~ Shile fox event ale fox She. } 3 at Visited {| Mished \ank araenes i clcked : Spe Wer, wale «CSS Lists, _ list-style= types circle square ; list-stule- image % yl Cvs!) 5 Grdeved tick — af list-sWjle-type : Uppey-roman) + fower - romans Uppet- aipha, (ower- abe ha } list-style - position, outside / Instde » epstng chyle fo nang ine can remove buble! poink by list stile - type None" moran MPAs faatlepKCSS Tables | we can devine> borders , background colors 4e% 4) | _ovents of mouse te +0 a Heable, th td { {| bordey-cofinpse Collapse ne border |px_,$ +éali_Blask— iv) tiidth / 2p +i 9b pay vy) tex! align | lefe : 2iainy t wl tating ac "color! packgyound-talay"colouw?= overfiow) nat clipped: hidden _-avertiow hidden eal | _-_dver Row handled with Rcrol\boy comp’ auto _~ ev-Screl| box only when MERE ESITY. + 1” ‘ // To mandie everow in TTR SEY Liveikens Syl i mer 4 pe. for po: itoning, and formatting Contontijaside of container ee i cleay — it is used aftey toe Saat property to decide “wheather element Showd be an pert ta fier Seated eer AT E er ales : || Ree Seed TORR NARA VAAL -] PLL AF Wor cleay > right, jeft; Yrovie; jonent) - ae eee eee ee ee > none, yy floasing Slement 1 idle Cyowe inhent' Wankel on ei Pres lode ctlloweDicplay - averide element's inline o% tat a property - i Hiselay : inline: — - : a block! intine ~bloc| “visibility. i hidden’, aim clement oft layout bn - is_ hidden - -_ when there 16 _conftict | we follow the tule =] | pecauce Him fallaws a << twben external acchiahom bepuseet have cantnct< | eyo the Same rule a5. per the potitien of et | Jeclazayion aS _rmast af time <\ink > decked ak — ~___} beac) Cop) ee = 2)| when there jc po cnafiice 14 fellows ‘cUse. _lP Gate dedarvaHan mMexaed" __Inhey stance Bhody| element Chilel ol Any property given to Gorse Ot __ is digg ininesited b { ement tike DPropeatyes. Fnecn| [element B2 @ hented - class Pseudo class} —} ao Athioure Elements esdiv tony parog C86: ae ae = cE efesimes BE ie| css Text styling -_ [tose Family — It gives. afferent: font Cheies for user's 4 browser from which brouser Saeded fern which it Supports - _ 2:9: font-family! Ariel, Helvetica, sans-Sesf 5 _ Tt allows to set Colors either by Namect.— —Calay— ____by_ RGB formats_ in _henodewina) no - _ “followed ahez te, ot [1Qbu' ©, 0,00) | a |] eg-color: #0000r ; —_*P" eee Red green Blue zl ie | cont-style - Tt gives options ike §)_NovmaJ ii) falc a i) Oblique tv) inherit _€-9.-font= tyle * italic ; — _ font = weight —— It gives boldness — by assigning the word Value Bold or Auumbers 10x _ font -Size - The defawt is Tle px! for most_of browsers we con ser it with [px] declaration ot [*[ of defauy eg font-Size : 24PX; rs But font sizes Changes according to User Male 4b. Zoom in of Zoomoauk So keep evexytht ny yelave to Cach abher we, Style tnt siz with reloHve Stylin method ad folloudNow when Wwe want te change the style a fonysse, e—redeclave without dverddi ng saga bul re eee, : 2 style = “font- -S[2e = 2em’>~ -— _ Tspubrere suai ellipsis; => Enbiam Sa.) —_taard=bee veep -all; => Sreak only at spo _ break-alt; => Break abany ¢ Chena word WraP breakeuand D Sf break wer! & ion amaeueame Pop AFL In bx _wrtng-mede: -bovizan roy —4 tb; 3 writeh __ Vertical - -v1; LP wroipe UPsiSate Margin + Border = Width eer “width= Width + 2x Boxdet + 2x Padding +2xmargive _heignt= height + 2¥ Bokder+-Ax padding texmesgize. St : - oe a background color: jor! green,’ oe padding ! 10.Px ./OPX, 1OPX, 1OPX Hag r _ a = border. 5 px— Solid black; margin: 4opx 3; 5 width 180 PX js neight | 10 PX; background -color ‘violetsheist = = lo+ St5tfotlo = = 40 px ——s [ways addi Hon of aul lement_insid {| lemenk content, bardez and pad as bar je a dleHined_ts content—bur_if- can be be changes Using property | hox-Si 211g ; bord er= ——1Side that c'eroonf styling ty pa rial | | 4, +2 ¥Selectoy for dl] the element PCa 2G bawdee= box; fi foe all. ements dy f - WL 4%. Unjld_elemren)! — | bax “Sizing: borcle>-box » fl foy spetre Geersx ____maxains-onSame line = = ana velo — get Commulasee} Hen oe EL. a ec ie as witt— ts_handje the _Situahon- orflow’ Wigiple - Default it cause text fooverflow out hidden - Tt hides the textthat dont At ingde al - ft Provide Scrollbar whenever Necs vol] TE always Provides two scro}ibor even Onen Nor Yrequrer-ea oe [mes | We use Cos fous to Style. the form. elemeok \ike “jopur_uxth —_clifferenr _fowmars ae a Input Field —_ OPur +. — = a — Width 2 So”, —- -- - -— Padding? 12PxX_20PX , ae margin) Spx __ bax = Sizing > _____berder __: _2?x _ _boxder =rodiugt 4P x 3 eclar 2 black; 7 ———— npur field _urith Specific type To style specific type of lo pu 7 - topur Ltupe = text] £ i ee input [type = Pass 2oxd } - Wpilk Liyee = number] f Foqused inputs | To change the Style when it gers focused (clicked) we use [forse | Selector fer doing so — input Ctupe= text] ¢ Focus 2 bo ckgzaund=color 2 \\ghtblve { TP Icon) wnerge en jnsidte. the jnOuh_Use tne feat oes We inp Lope etext] { — oo paaguunletor swhites bce ground = image. : Oy] C'seacricon Png); pre TROUT = POA HOH: [OPK WpxE —- ey : i ST nous Leypes text} } _ “transitions widlth a4s- “ease in-cut = width, Sen ; aaa pues eo eters - - ead iag dektareas input — use rece, psope WR OI, QY UNO GY LOK Ors 055 VS Srovld he “BSATAAL setea- meng —_________—— L width = joos, | _ border! Wane; :Bisse ian, giiane ee - ting—ane—CSS_sty je 40 Oth Other | fe geet oe | Selectors as Fallows = _ — Foe —start | — from Csameas Bey 1o%o ft ' at ——_}—_}-} — oe | Sore i | en — a Toor end EO Came an loos) aa Syntay NO — - | key fumes animatinnname £$ eayfeame {Coe-stet animation =delay delay to_start_animakian’ Seconds. aia “E _ an maticr=delayanimation —rerayion=Coumy = hambbex OF Mme > ———0-ooao—ooo ropoat: ‘Se - (animation= Sterapion- ae animadion =z curecion ~~ =animalion to place. animation ~ ctr ens io. Z| animaton. Haniny Puncion j= Aetna, animal, 4+——— speed tuyve _) ensecin- # slog staat ___rease -ouy If slow end Y mini! de Fine ‘deb nc animation = Hl|- Mode — Style of element When iement when the animadHon jg nok play |i animation —Fill- made $ none Mo Stle before! 2 forward s/ Keeps last hour 1 backw ord g// teers Kashhow : fboth . // eviend propery " foruury = hadeworl |width Hoopy + — ____ height JooPxs i — “background-color | feels _ __Positign : relative, animanoen= Name+ example } 7 _auumahon= durahon 2 4S 5 — _animadon — ikexatvon-counh: 33 _ Layimakhied) — Mireut on nse, __ ee @nimanon ~ deny iD ~ aimarion - Hming- “anesion ease eunimarion- M-mode » Forwards _ or £ bacuground-coler s red 5 (ett! opx 5 top “opi 507. baceground-Clers blue, lefhs zoopx op | rx _ loo £ backgrounel- Colors green, left vopx; fer! OPxt| -Novigapion bar is a kind of list 5 “ute. i uit has oar of bern) list elements and therrae. list - style ~ £Y PC. + None! - an 4 2 wid 2 GO fied th of Nav iguhion'oor a oie Hf oadegroud calor z eight: 5o% - Uf height oF Novisndyenboe ——faltion vei Position of Navigau oo _ bor with reseeck to ete Shows be Fixed ot Move 7 ce UAE Page Scvoll- ot enjoy + t00000} taf _ display bot | I] 4o make phek ebement Il coloy of text ot tab ¥ whites _ color | fh color oF tEXb when : hove. anne ers “aRey _Horizonte] Nav Bor ; fact bay ———- ieontal’__NavigoHoo . 1 Horizon EE [to make whole0ren. -aickayy - 2 [disploy to foak plackS ; ] to fin Navigatonber © Page Piston fixed - text — align? center 3 ——_____ Padding + l4Px I6px3. —_ text ~ decoration / none > bark ground-colet tH 4cAESOy ~To_rnake tabs divider. io Navigation bar use ° Property border right » border — ereSS Grid oe i J | css grid__tysec} For —deHning elements ke key pad. | wnen [Biv] elemenis are declared inside diy] then ouser [div] is _grid-container and, are. grid Qiements/items. t [grid contadner a a __ clisptay = ariel; a es ~Orid=colurnn-gap (2PX3; 7 Siid= row =gap;gex; I Pid =90P BPX BPX — : Or id=tepiabrearcolamnn auto —Sopx- cute: Brot template =10 ws aaneo Bopx alutD , yT Ae oF elemenrdetined defines column, row Pembers ante js _tandefimead- stee—anel-s7 2 ony be given. Were 3X2 reared. . nap rari, a 4+ aio 2