Slik formaterer du nettsteder

En effektiv nettside må formidle innhold til sine lesere gjennom attraktiv formatering. Dårlig formatering kan gjøre et nettsted ubehagelig eller ulastelig. Med HyperText Markup Language (HTML), kan du styre en nettsides formatering slik at den vises akkurat som du ønsker. Videre lar Cascading Style Sheets (CSS) deg muligheten til å formatere et nettsted ved hjelp av et eksternt stilark. Denne teknikken er nyttig hvis du ønsker å bruke den samme stylingen til flere sider på nettstedet ditt.

HTML-formatering

1.

Opprett tabeller for å plassere de ulike elementene på websiden din. Bruk en

tag for å starte selve tabellen. Bruk en tag for å starte en tabellrad, og a
tag for å lage en celle med tabelldata innenfor raden. Tabelldataceller kan vanligvis betraktes som kolonnene i et bord. For å kunne plassere elementene dine på passende måte, eksperimentere med parametrene høyde, bredde, polstring og mellomrom for individuelle rader og dataceller.

2.

Legg til teksteffekter og skrifttypestyling i kodene for elementer som inneholder teksten. For eksempel, hvis du ønsker å formatere teksten i et avsnittelement:

Dette ville gjengi innholdet i avsnittet i tegneseriefonene.

3.

Legg til en bakgrunn på hele nettstedet ditt i taggen, ved hjelp av bgcolor-attributtet. For eksempel:

Dette gjør bakgrunnen til hele siden i rosenfarge.

CSS og eksterne stilark

1.

Åpne et nytt tekstdokument i Notisblokk.

2.

Formater hvert element i ditt nye dokument. Bruk elementetiketten etterfulgt av en åpen brakett for å introdusere stiler for det elementet. For eksempel:

p {

font-familie: "comic sans ms";

bakgrunnsfarge :: # CC3366;

}

Hvert avsnitt i HTML-dokumentet ditt har Comic Sans-skrifttypen og har en rosenbakgrunnsfarge.

3.

Bruk en ID eller klasse hvis du ønsker å presentere stiler som vil bli brukt på tvers av flere forskjellige typer elementer eller i individuelle tilfeller. En ID kan bare brukes en gang, og presenteres av symbolet "#". En klasse kan brukes flere ganger, og er betegnet av "." symbol. For eksempel:

.comicrose {

font-familie: "comic sans ms";

bakgrunnsfarge :: # CC3366;

}

Denne klassen lar deg style et element med Comic Sans og en rosenbakgrunn hvor du enn kaller sin klasse. For eksempel, i HTML-koden for siden din,

Stiler et avsnitt som beskrevet.

4.

Koble til et eksternt stilark i delen av HTML-koden din. For eksempel:

.

Dette kobler til et eksternt stilark kalt pagestyles.css.

Ting som trengs

  • Tekstredigerer

Populære Innlegg