' margin-top ” atribuut aitab paljudel arendajatel luua reageerivaid paigutusi ja positsioneerida HTML-elemente. „Margin-top” atribuudi kasutamine annab HTML-elementide üle suurema kontrolli, lisab visuaalset eraldatust ja aitab luua paremini reageerivaid kujundusi. See juhend näitab marginaali ülemise omadust praktilise rakendamisega CSS-is.
- Mis on 'margin-top' vara?
- Kasutage positiivse väärtusega atribuuti „margin-top”.
- Kasutage negatiivse väärtusega atribuuti „margin-top”.
Mis on 'margin-top' vara?
' margin-top ” atribuuti kasutatakse HTML-i elementide vahele lisaruumi loomiseks. Seda saab määrata nii positiivsete kui ka negatiivsete väärtustega. Need väärtused määratakse vastavalt kujunduse vajadustele ja aitavad vältida kattumist ja reguleerida HTML-elementide vahesid.
Kuidas kasutada positiivse väärtusega „margin-top” kinnisvara?
Positiivse väärtusega atribuut „margin-top” lisab ülemisest positsioonist valitud HTML-i elemendi keskpunkti poole täiendavat tühikut. Esitatud väärtus võib olla pikslites, protsentides, rem või globaalsetes väärtustes, nagu auto, inherit, unset jne. Parema mõistmise huvides vaatame läbi näite:
Näide: positiivse väärtuse kasutamine
Oletame HTML-faili, mis loob ' Pärast HTML-i struktuuri loomist rakendage CSS-i atribuute ' positiivne ” klass: Ülaltoodud koodilõigul: Pärast ülaltoodud koodilõigu täitmist näeb veebileht välja järgmine: Ülaltoodud gif illustreerib marginaali ülaosa atribuudi väärtuse määramise mõju veebilehel. ' margin-top ” atribuut negatiivse väärtusega määras valitud HTML-i elemendi suhtes täiendava vahekauguse ülemisest positsioonist keskele vastas või lehe väliskülje suunas. Seda kasutatakse enamasti kattuvate efektide loomiseks või HTML-elemendi positsioneerimiseks. Parema mõistmise huvides toome läbi näite. Näide: negatiivse väärtuse kasutamine Oletame HTML-faili, mis loob ' Ülalmainitud koodilõigu kirjeldust kirjeldatakse allpool: Pärast ülaltoodud koodilõigu täitmist näeb veebileht välja selline: Ülaltoodud gif näitab mõju, mis ilmneb veebilehe kujundusele, määrates marginaali ülaosa atribuudi negatiivse väärtuse. ' margin-top ” atribuuti kasutatakse HTML-i elementide vahele lisaruumi loomiseks. Seda saab määrata nii positiivsete kui ka negatiivsete väärtustega. Kui atribuudile „margin-top” on määratud positiivne väärtus, lisatakse lisaruum veebilehe või valitud HTML-i elemendi keskele. 'Negatiivse' väärtuse korral lisatakse tühik, kuid lehe väliskülje poole. See artikkel näitab, mis on CSS-i margin-top atribuut.
< keha >
< div klass = 'positiivne' >
< lk > Määratakse positiivse väärtusega marginaal lk >
div >
keha >
< stiilis >
.positiivne {
laius: 300 pikslit;
kõrgus: 200 pikslit;
taustavärv: metsaroheline;
fondi suurus: 20 pikslit;
värv: #fff;
ülemine veeris: 50 pikslit;
}
stiilis >
Kuidas kasutada „margin-top” atribuuti negatiivse väärtusega?
.negatiivne {
värv: valge;
teksti joondamine: keskel;
taustavärv: punane ;
margin-top: -30 pikslit ;
polster: 30px;
kõrgus: 100 pikslit;
}
stiilis >
< keha >
< div klass = 'negatiivne' >
Negatiivne väärtus on määratud jaoks Margin-top vara
div >
keha >
Järeldus