Hvordan lage en CSS-kode Banner

May 2

En Cascading Style Sheets (CSS) banner er en overskrift som er laget av CSS-stiler i stedet for et digitalt bilde du setter på siden din. Banneret viser typisk tittel og slagord på nettstedet ditt, og med CSS du ikke bare stil denne teksten, men du bygge og formatere boksen som inneholder innholdet. Bruk datamaskinens tekst editor program for å gå inn i CSS-kode som gjør et banner på siden av ditt valg.

Bruksanvisning

1 Åpne din nettside dokumentet i datamaskinens teksteditor søknad. Plasser markøren før den avsluttende </ head> -taggen, og skriv dette CSS-kode:

</ Style>

2 Type "#banner {}" mellom stilelementer for å lage en regel som gjør banneret. Skriv "height:;" og "width:;" og skriv inn en verdi i piksler (px) etter hver enkelt å angi foretrukne målinger. For eksempel:

banner {height: 350 piksler; width: 600px; }

3 Skriv "font-size:;" og "font-family:;" å skape attributter som formatere header tekst. Skriv en pikselverdi etter font-size, og skriv to eller tre skriftnavn etter font-family å angi ønsket skrifttype. Å illustrere:

banner {font-size: 32px; font-family: "Times New Roman", Georgia, Serif; }

4 Skriv "border-style:;" og skriv en pikselstørrelse, linjestil og heksadesimale fargeverdien til design omrisset av banneret. Videre skriver du "background-color:;" og følg denne med en foretrukket fargeverdi. For eksempel:

banner {border-style: 4px stiplet # f0f0f0; }

5 Skriv "padding:;" etterfulgt av en verdi i piksler for å angi hvor mye plass som viser mellom innhold og grensen på banneret. Din komplette CSS koden ser nå ligner på dette eksempelet:

banner {

høyde: 350 piksler; width: 600px;

font-size: 32px; font-family: "Times New Roman", Georgia, Serif;

border-style: 4px stiplet # f0f0f0;

padding: 15px;

}

6 Skriv "<div id =" banner "> </ div>" hvor som helst under åpningen <body> -koden der du vil at overskriften skal vises. Skriv inn banner tekst, slik som nettstedet tittel, mellom div koder som så:

Skriv inn banner tekst her.

</ Div>

7 Lagre dokumentet.