Atribuudi Clearfix kasutamine võib automaatselt reguleerida ülemelementi vastavalt alamelemendile ja lahendada HTML-koodis esinevad probleemid mõne atribuudi abil, näiteks ' ülevool ”, mis juhib ülem- ja alamelementide mõõtmeid ilma täiendavaid märgistusi nõudmata.
Clearfixi atribuudi kasutamine
Mõistame atribuudi clearfix kasutamist, et teada saada, mida see väljundiga teeb, lisades HTML-koodilõigule CSS-i clearfix atribuudi:
Ilma Clearfixi atribuudita
Käitame koodilõigu ilma atribuuti clearfix käivitamata, et mõista, milliseid probleeme Clearfix suudab lahendada:
Looge HTML-is klass, mis lisab pildi div konteinerisse:
< div klass = 'selgitada' >
< br >< img klass = 'img' src = 'image.png' kõike = 'pilt' laius = '250' kõrgus = '180' >
Tekst...
< / div >
Järgmine on ülaltoodud HTML-i CSS-kood:
.selgitada {
piir : 3 pikslit tahke #2baa12 ;
polsterdus : 5 pikslit ;
}
.img {
ujuk : vasakule ;
}
See genereerib väljundi nii, et pilti sisaldav alamklass voolab konteinerist välja. Sellistes olukordades saab selge paranduse atribuuti kasutada selle probleemi hõlpsaks kõrvaldamiseks või parandamiseks.
Clearfixi atribuudiga
Probleemi lahendamiseks saame lihtsalt lisada ühe ülevool atribuut, mille väärtus on võrdne auto mis kohandab põhikonteinerit vastavalt alamelemendi suurusele:
.selgitada {
piir : 3 pikslit tahke #2baa12 ;
polsterdus : 5 pikslit ;
}
.selgitada {
ülevool : auto ;
}
.img {
ujuk : vasakule ;
}
Selle koodilõigu puhul on emaklass konteiner ja pilt sisestatakse selle alamklassi:
< div klass = 'selgitada' >< br >< img klass = 'img' src = 'image.png' kõike = 'pilt' laius = '250' kõrgus = '180' >
Tekst...
< / div >
Clearfix atribuudi lisamine laiendab automaatselt ülemelementi (konteinerit) vastavalt pildile sisestatud alamelemendi suurusele:
Nii töötab Clearfix atribuut HTML-is.
Järeldus
Clearfix atribuuti kasutatakse HTML-i alamelementide kohandamiseks põhielementide järgi lihtsa clearfix atribuudiga ilma täiendavaid märgistusi nõudmata. CSS Clearfixi kasutamine suurendab või vähendab lähteelementide mõõtmeid, et kohandada neid vastavalt alamelementide mõõtmetele.