Հասկանալով CSS մաքուր գույք

CSS- ի հստակ հատկությունը CSS- ից սկսած CSS- ի մաս է կազմում: Այն թույլ է տալիս պարզել, թե ինչ տարրեր կարող են բախվել մաքուր տարրի եւ կողմի (ների) կողքին: Հստակ գույքը ունի հինգ հնարավոր արժեքներ.

Ինչպես օգտագործել CSS- ի հստակ գույք

Մաքուր գույքի օգտագործման ամենատարածված ձեւն այն է, երբ օգտագործվել եք տարրային տարրը: Օրինակ:

Իմ կողքին գտնվող տեքստը:

Տեքստ, որն իմ պատկերից ցածր է:

Բոլոր տարրերը կանխորոշված ​​չեն `ոչ; , այնպես որ, եթե չես ուզում այլ տարրեր բախվել ինչ-որ բանի հետ, դուք պետք է փոխեք հստակ ոճը:

Երբ դուք մաքրում եք փչովի պոչը, դուք կհամապատասխանի ձեր հստակ ձեր բոցին: Այնպես որ, եթե դուք տարեք տարրը ձախ կողմում, ապա պետք է մաքրել ձախ կողմում: Ձեր floated տարրը կշարունակի բոցել, բայց մաքրված տարրը եւ ամեն ինչ այն բանից հետո, երբ այն կհայտնվի վեբ էջում:

Եթե ​​ունեք տարրեր, որոնք ձողված են թե աջից, թե ձախից, կարող եք մաքրել միայն մեկ կողմը կամ կարող եք հստակեցնել:

Օգտագործելով հստակ Layouts- ում

Դիզայներների առավել տարածված ձեւը օգտագործում է հստակ հատկությունը էջի տարրերի դասավորության մեջ : Դուք կարող եք ունենալ տեքստի բլոկի ներսում գտնվող լողացող պատկեր, եւ ցանկանում եք հաջորդ պարբերությունը սկսել ներքեւ ստորեւ, կամ դուք կարող եք ունենալ ամբողջ սյունակ տեքստը, որը ցանկանում եք բարձրանալ տեքստի մեկ այլ փաթեթի կողքին, ստորեւ նշված տեքստը:

Ահա HTML- ն այս ձեւի դասավորության համար:

Այն ունի մեկ բաժին բեռնարկղ, մյուսը պահում է ձախը:



Մի կարճ գոտի



Բովանդակությունը ներսում բեռնարկղի div, որոնք լինելու են դեպի աջ floats div.

Դա կաշխատի տուգանքով, այնուամենայնիվ, կարճ սլաքը լողում է հիմնական div- ի մնացած բովանդակության ձախ կողմում:

Դուք կարող եք մաքրել տուփի կողքին գտնվող տեքստը, պարզապես ավելացնելով մի տող, որտեղ ցանկանում եք, որ այն սկսվի գրված տուփի տակ:

Բայց խնդիրն այն է, երբ լողացող վանդակն ավելի երկար է, քան կողքին գտնվող բովանդակությունը: Այնուհետեւ, ինչպես տեսնում եք, հիմնական տուփի ֆոնի գույնը չի տեղափոխվում լողացող տուփի ներքեւի մաս:

Բարեբախտաբար, դա հեշտ ճանապարհ է ամրագրել `գույքը: Հիմնական տուփը գերազանցելու համար `ավտո; ֆոնի գույնը կպահպանվի երկար լողացող տուփի կողքին, ներքեւի մասում, ինչպես ցույց է տրված այս օրինակում :