Hva er din CSS-stil? - dummies

En av de mest forvirrende aspektene ved å jobbe med CSS (Cascading Style Sheets) er at du kan skrive stiler på så mange måter. Ligner på å skrive prosa, bare fordi du forstår de grunnleggende reglene for grammatikk og stavemåte, betyr ikke at du har mestret å skrive konsisprosessen.

Erfarne CSS-designere bruker mye tid på å lage korte, klare CSS som er enkle å redigere og oppdatere. Men de som er nye for CSS, er tilbøyelige til å skrive flere stiler enn nødvendig, og for å skape overflødige stiler.

Ikke bare gjør redundant kode lenger å laste ned til en nettleser, det er mye vanskeligere å redigere eller revidere senere. Og jo mer overflødig koden din er, desto mer sannsynlig er det å kjøre inn i stilkonflikter.

Her er fem tips for å skrive rene, effektive stiler:

• Opprett aldri to stiler når en er nok. Du kan for eksempel lage en stil ved hjelp av tagvelgeren for alle

  -koder som endrer skriftfamilien i overskriftene dine, og deretter oppretter du en annen stil med en klasseväljare som du kan søke på overskriftene for å endre farge.

  Men det ville være mer effektivt å definere både fargen og fontfamilien i samme stil. Husk at du alltid kan gå tilbake og redigere en stil for å legge til en annen regel hvis du vil endre stilens formatering.

• Forkort heksadesimale fargekoder. Du kan definere farger i CSS ved å inkludere hele heksadesimale fargekoden. Men når du bruker fargekoder som er repeterende, må du kun inkludere de tre første tegnene. For eksempel er #ffffff det samme som #fff; begge vil skape fargen hvit.

• Bruk eksterne stilark. Du kan definere stiler i et internt stilark øverst på hver nettside, eller du kan lagre stilene dine i en ekstern fil med. css-utvidelse og legg til det stilarket på alle websidene dine. Eksterne stilark er iboende mer effektive fordi de gjør at du kan bruke samme stil på noen eller alle sidene på nettstedet ditt.

  Hvis du for eksempel definerer en stil som gjør alle hovedoverskrifter fet, blå og stor, kan du lagre den stilen i et eksternt stilark slik at du kan bruke samme stil for alle overskrifter. Hvis du senere bestemmer deg for å endre overskriftene dine til grønt, kan du endre stilen i ett eksternt stilark og endre alle overskrifter samtidig.

  Hvis du hadde lagret stilene i et internt stilark, må du redigere overskriftstypen i hver fil.

• Utvikle en navngivningskonvensjon for dine stiler. Selv om du kan navngi stiler som er opprettet med klassen eller ID-velgerne, vil du helst velge stiler som har betydning bortsett fra formateringen.For eksempel, hvis du oppretter en stil som heter. redHeadlines og deretter senere bestemmer deg for at du vil ha alt. redHeadlines å være blå, du enten vil ende opp med en blå overskrift stil kalt. redHeadlines eller må endre navnet på stilen.

  Og omdøpe stilen inkluderer å gå tilbake og bruke den stilen overalt, du har en rød overskrift som du vil bli blå, noe som forkaster kraften i stiler for å lage globale oppdateringer. For å unngå dette problemet, opprett stilnavn som refererer til plasseringen eller betydningen av elementer, for eksempel. mainHeadlines eller. sidebarHeadlines.

• * Test og valider koden din. Selv erfarne CSS-designere gjør feil, derfor inneholder Dreamweaver så mange gode verktøy for testing og validering av koden på websidene dine. Pass på at du tester CSS for vanlige feil.

  Følgende er to online testtjenester som du kan bruke til å sjekke om feil i CSS-koden din. Bare skriv inn nettadressen til en hvilken som helst nettside på Internett i adressefeltet på en av disse nettstedene, og klikk på Send-knappen for å motta en rapport som viser eventuelle feil i koden din:

  • Valgetasjonstjenesten W3C CSS

  • XHTML-CSS : Vær gyldig eller dø læring