Hvordan lage en DIV stilelement

Hvordan lage en DIV stilelement


En DIV element er egentlig en HTML beholder for tekst, bilder eller annet innhold. DIV elementer tillate deg å style og organisere innholdet ditt med en stor grad av fleksibilitet. Du kan raskt lage svært tilpassede DIV elementer ved å endre de grunnleggende DIV HTML sekvens.

Bruksanvisning

1 Sett inn følgende kode fragment inn i HTML på plass i din koding der du vil at DIV element å skje:

<Div id = layer1 style = "position: absolute; top: [A]; venstre: [B]; width: [C]; height: [D]; z-index: 1; padding: 5px; border: # 000000 2px solid; background-color: # 000000; background-image: URL (yourfilename.gif); ">

[Innhold går her]

</ Div>

2 Bestem hvor langt fra toppen av siden din (i piksler) du ønsker din DIV element som skal plasseres. Bytt [A] i kodesekvensen med denne verdien.

3 Bestem deg for hvor langt (i piksler) du ønsker din DIV element rykket fra venstre. Sett på [B] i kodesekvensen med denne verdien.

4 Bestem deg for hvor bred (i piksler) du ønsker din DIV element å være. Sett på [C] i kodesekvensen med denne verdien.

5 Bestem deg for hvor høye (i piksler) du ønsker din DIV element å være. Sett på [D] i kodesekvensen med denne verdien.

6 Endre "z-index" verdi hvis du har flere, overlappende DIV elementer ved å finne den fragment "z-index: 1" i koden og endre den numeriske verdien. Standardverdien, en, er det laveste nivået DIV element, nivået lengst til bakgrunnen. Hvis du ikke har flere DIV elementer, kan denne verdien stå på en.

7 Bestem deg for hvor mye "padding" du ønsker inni DIV element. Padding er hovedsakelig den margen inne i DIV selv. Standardinnstillingen for padding er 5 piksler. Hvis du ønsker mer eller mindre padding, endre tallverdien i fragment "padding: 5px". Et høyere antall vil øke polstring, og et lavere tall vil redusere den. Pass på å la "px" betegnelse på plass.

8 Stil grensen av DIV element. Fragmentet av kode som styrer grensen stilen er "border: # 000000 2px solid". Den "# 000000" er hex-kode som styrer fargen på grensen. Endre hex koden til fargen du ønsker. Den "2px" betegnelse definerer bredden av grensen. Øker denne verdien vil øke bredden av grensen. Avtagende denne verdien (til minimum 1) vil redusere verdien. Hvis du vil ha en ramme som er prikkete, stiplede, double, groove, ridge, innfelt, eller utgangspunktet endre begrepet "solid" i koden til varigheten av ditt valg. Hvis du ønsker en DIV element uten kant, kan hele denne delen av koden utelates.

9 Endre bakgrunnsbilde av DIV element ved å erstatte "yourfilename.gif" i kodefragment "background-image: URL (yourfilename.gif)" med filnavnet på bildet av ditt valg.

10 Sett på [Innhold går her] med hva innholdet du ønsker inni DIV element. Dette kan være tekst eller bilder.