Hvordan Lay et element på toppen av alt i CSS

Hvordan Lay et element på toppen av alt i CSS


Når du bygger kompliserte, multi-element nettsider --- spesielt de som bruker absolutt plassering av sideelementer, hvor det er viktig at brukeren ser akkurat den siden som du har designet det --- du noen ganger må sørge for at ett element er plassert i løpet av alle de andre. CSS omfatter denne funksjonaliteten i form av z-indeksering, som er en måte å definere virtuelle lag på siden med det øverste sjiktet alltid mottar sikten prioritet.

Bruksanvisning

1 Åpne HTML-koden for websiden din. Du kan bruke ditt foretrukne HTML editor hvis du vil, men endringene er relativt grei, så du kan også gjøre bruk av Notepad, TextEdit eller noe lignende enkel tekst editor.

2 Bla ned til sideelementet du ønsker lagdelt over resten av siden. Kontroller at det er plassert --- det vil si, den har "posisjon" CSS attributt (position: absolute, stilling: fast eller position: relative i elementets "style" tag).

3 Legg kodebiten "z-index: 100;" til "stil" tag på siden element. For eksempel, en <div> element med z-index brukt kan se slik ut:

<Div class = "subcontainer" style = "position: absolute; left: 20px; top: 20px; z-index: 100;">

Hvis den ikke har en stil tag, tilsett ett, med "z-index: 100" som eneste argument. Dette vil plassere elementet over resten av siden og eventuelle elementer med z-indeks under 100; som standard, er siden z-indeksert på 0.

4 Lagre filen, tett og avslutte den. Åpne HTML i en nettleser for å kontrollere at elementet viser nå korrekt, plassert over alle de andre på siden.