Brug af CSS i stedet for tabeller

Brug af CSS i stedet for tabeller

Den Web Standards Project har etableret vigtige web standarder for Cascading Style Sheets (CSS), der gør det klart, alle webdesignere skal bruge CSS i stedet for tabeller i at designe deres websider.

Web Standards: Designere bør bruge CSS i stedet for tabeller

Lige siden Web Standards Project (WaSP) anbefales brugen af ​​CSS i stedet for tabeller til website layout, webdesignere begyndte at fokusere på at bruge style sheets til deres hjemmeside design. § 2.1.3.4 i standarder FAQ dokumentet har titlen CSS - Cascading Style Sheets, og anbefaler, at stylesheets bør anvendes "konsekvent" for at definere hjemmesidens udseende. Projektet anbefaler udfasning ældre layout-specifikke funktioner og erstatte dem med cascading style sheets.

Hvad er CSS?

Cascading Style Sheets (CSS) er en Internet programmering protokol, som formaterer forekomsten af ​​forskellige elementer i en webside ved at tildele stil værdier inden for HTML eller XML. For eksempel kan du bruge style sheets til at definere ting som hvordan alle punkter vil blive vist, marginer og padding for alle overskrifter eller skrifttype og linjeafstand efter tekst på forskellige blokke indhold. Fleksibiliteten i CSS er imponerende, og det faktum, at det giver dig mulighed for at omformatere hundredvis af HTML-websider med en enkelt ændring i en .css fil gør det til et uhyre effektivt værktøj til at håndtere websites.

CSS i sin enkleste form indeholder en .css fil og en index.html fil. Dog kan designere tilføje flere .css filer og disse .css stylesheets kaldes indenfor "hoved" sektionen websiden med følgende kode:

<Link rel = "stylesheet" type = "text / css" href = "./ css / default.css" />

Inden for en css-fil, er egenskaberne af forskellige elementer i HTML-siden er defineret som følger:

#contentBlock {bredde: 700px; flyde: til venstre; padding: 15px 0; }

Endelig i html fil, hvor dette stylesheet bliver brugt, alt inden de "div" tags, der kalder dette element er formateret som defineret ovenfor. Elementet hedder på websiden som følger.

<Div id = "contentblock"> ## Indholdet indtastes her ## </ div>

Effekten af ​​denne teknik er, at hver gang en bestemt formatering stil er påkrævet, kan du blot ringe til dette element ved hjælp af "div id =" ringe at formatere indholdet.

Hvorfor Bruge CSS er bedre end at bruge tabeller

Et simpelt eksempel på den store forskel mellem CSS og tabeller er i det tilfælde, hvor en designer har brug for tre kolonner med tekst pænt formateret og jævnt fordelt fra midten af ​​siden. CSS giver dig mulighed for at oprette indhold blokke, bruge "div" sektioner, for at skabe de tre uafhængige søjler. Det stylesheet definerer margener, formatering og placering af disse kolonner. På den anden side ville en tabel, der anvendes til samme formål kræver en omhyggelig placering af bordet, og vanskelige manipulation af kolonner og rækker for nøjagtigt at placere disse kolonner, hvor de er ønskede. Indhold og adfærd af hver del af tabellen har desværre en effekt på andre dele af tabellen. Dette er grunden til at formatere en side med tabeller kan være langt vanskeligere end ved brug af stylesheets.Additionally, selvom du formår at formatere en side ved hjælp af en tabel, og så genbruge det bord design på 10 eller 20 sider, hvis du nogensinde beslutter at foretage en ændring af format eller stil af denne tabel, skal du redigere alle 20 sider til at replikere den stil ændring til dem alle. I tilfælde af CSS, du laver en enkelt redigere i .css filen og formateringen forandring replikeres gennem alle dine websider, om der er 20 af dem, eller hundredvis af dem.

Er tabeller bruges længere?

Emnet om tabeller er en saga blot er yderst tvivlsomt. Tabeller fortsat tjene webdesignere godt, når det kommer til mindre elementer i indhold. For eksempel at placere et billede og tekst i et pænt formateret afsnit som en del af indholdet i et afsnit "div" forbliver en meget almindelig fremgangsmåde. Dette skyldes, at en simpel tabel hurtigt kan formatere indholdet mens det omgivende indhold over og under det uberørt. Selvom CSS har fjernet et bord nytte for den samlede side design og format, tabellen stadig har værdi, når det kommer til formatering mindre sektioner af indhold på en enkelt side, hvor formateringen er unik for dette indhold, og ikke anvendes andre steder på et websted.

Lære at bruge CSS

At lære at bruge CSS i stedet for tabeller er meget let. Der er mange tutorials på tværs af internettet, samt bøger og ressourcer på dit lokale bibliotek eller boghandel. Nogle store online tutorials omfatter følgende.

  • Quackit har et stort bibliotek af CSS tutorials.
  • CSS Tutorial tilbyder en meget enkel 3 del tutorial om CSS.
  • Smashing Magazine tilbyder en hel hjemmeside helliget lære CSS.
  • HTML.net giver gæsterne en omfattende gratis CSS tutorial.

Uanset om du er en ny web designer eller en veteran, CSS er nu den nye web standard, og enhver alvorlig webdesigner har brug for at forstå kraften i Cascading Style Sheets, og hvordan de skal bruges hensigtsmæssigt i processen med at designe en hjemmeside.