CSS Vs. Tabell Elements

CSS Vs. Tabell Elements


Cascading Style Sheets (CSS) tilbyr en måte å skille en nettside form og innhold. CSS arbeider innenfor Hypertext Markup Language (HTML), og fungerer som et sett av retninger som kan bli bedt om å bøye visse HTML-elementer med stiler og formatering. Før CSS, den primære metoden for å formatere en nettside var gjennom HTML-tabellelementer. Begge disse metodene fortsatt arbeid og reflekterer ulike tilnærminger til webdesign.

HTML Table Elements: <table>, <tr> og <td>

Ved bruk av HTML-tabeller, må du begynne et bord med <table> -taggen. Dette forteller nettleseren for å begynne et bord. En tabell rad er opprettet med <tr> -taggen, og horisontalt tilstøtende celler er skapt av hekkende <td> kodene i et sett med <tr> koder. Før CSS, var dette den primære måten å arrangere tekst på en side, selv om du ikke ønsker å ha en eksplisitt synlig tabell på siden.

Tabell attributter og formatering

En HTML-tabell kan formateres ved hjelp av attributter i <table> -taggen. Noen av de mest brukte attributtene er "grensen", "frame" og "cellpadding" attributter. Den "grensen" attributtet brukes til å angi tykkelsen på kantlinjer rundt hver celle i tabellen. Uten "grensen" attributt, vil tabellen vise ingen grenser mellom cellene. Den "ramme" attributtet brukes til å spesifisere hva slags ramme hele tabellen vil ha. Den "cellpadding" attributtet brukes til å angi hvor mye tomrom ligger mellom grensene til en celle og celleinnholdet.

Styling en <div> med CSS

Den primære CSS alternativ til tabell-basert formatering er styling av HTML <div> element. Den <div> element skaper siden divisjoner, eller seksjoner. Med CSS kan du lage unike egenskaper for en ID eller klasse av <div>. På denne måten kan teksten på siden din ordnes slik du vil, i forskjellige avdelinger for hver <div>. Denne tilnærmingen har to fordeler fremfor bruk av tabeller for å formatere tekst: For det første, det skiller et nettsted form og innhold. For det andre, resulterer det i en mindre rotete HTML-kode.

Lokaliserings <div> -elementer

I tillegg til styling en <div> med visse skrifttyper, farger, kantlinjer og andre egenskaper, er CSS svært nyttig for å posisjonere ulike <div> klasser. Innenfor CSS, vil de "absolutte" og "relative" posisjoneringsmodi plassere en <div> element i forhold til de overordnede sidekanter eller til sin opprinnelige posisjon, henholdsvis. Videre <div> posisjoneringsmuligheter involvere lag, flytende, og sentrering.