|
Administreres af: |
| Tekstformatering og linier | Tilbage til oversigtstabel Tilbage |
Af: novicen.dk
Med de browsere, som idag - og i fremtiden - er på markedet, vil det være oplagt at foretage opsætning af web-dokumenter, således at anvendelse af styles - css - gør tilretning og vedligehold lettere. I praksis betyder det, at anvendelse af de gammelkendte FONT TAG's ikke længere er hensigtsmæssige, idet det vil være lettere at anvende BODY TAG, overskrifter - H TAG's, afsnitsangivelser - P TAG's, tabelceller - TD TAG's samt classes - klasser, som hovedelementer for formateringen af dokumenterne. Du bør i denne henseende skele til beskrivelsen for anvendelse af stylesheet angivet andet sted på dette websted.
| Stylesheet |
| Til top |
Overskrifter kan indsættes med H TAG's og der findes som standard 6 forskellige varianter fra H1 - den største - til H6 - den mindste. Ved brug af overskriftformatering vil der efterfølgende blive indsat en tom linie i fremvisningen af hjemmesiden. Der forekommer altså indsætning af nyt afsnit.
Syntaks: <h1>Overskrift H1</h1>
Ved anvendelse af styles er det muligt at sætte størrelsen for de enkelte H TAG's til den pixelmæssige størrelse som ønskes for TAG'en. Hvis angivelsen foretages i et eksternt stylesheet, vil ændringer i formateringen således kunne foretages meget hurtigt for alle web-stedets sider på én gang.
Opsætningen i det tilhørende stylesheet kunne eksempelvis være:
H2 {font-size: 22px; }
En komplet kildekode med indsat overskrift kunne se således ud:
<HTML> <HEAD> <TITLE>Titlen kan skrives her.</TITLE> </HEAD> <BODY> <h1>Overskrift angives her</h1> </BODY> </HTML>
Overskriftsformateringer skal altid afsluttes med deres modsvarende kode til ophævning: <H1>..</H1>.
| Til top |
Afsnitsformateringer - <p> - indsættes hvor browseren skal vise den efterfølgende tekst i et nyt afsnit. Ved overgangen fra ét afsnit og til det næste indsættes en ekstra - men tom - linie der dermed skaber luft mellem de enkelte afsnit.
For afsnitsformateringer gælder, at disse kan justeres mod venstre - hvilket er standard, hvis ikke andet er angivet - mod højre eller centreret.
<HTML> <HEAD> <TITLE>Titlen kan skrives her.</TITLE> </HEAD> <BODY> <h1>Overskrift angives her</h1> <p>Brødtekst justeret til venstre. <p align="right">Brødtekst justeret til højre. <p align="center">Brødtekst centreret. </BODY> </HTML>
Såfremt det indsatte element skal centreres uden at der samtidig forekommer afsnitsombrydning med den ekstra indsatte tomme linie, kan der indsættes en CENTER TAG omkring det pågældende element. Centrering kan ikke foretages for en del af en linie men skal være gældende for hele den pågældende linie.
Indsatte P TAG's skal ikke nødvendigvis ophæves med deres modsvarende kode, da den foregående P TAG automatisk vil blive ophævet ved indsætning af en ny P TAG samt ved indsætning af FORM, TABLE eller H TAG's.
| Til top |
Som hovedregel vil du kunne opsætte styles med samme font-egenskaber gældende for BODY, P og TD TAG's og du vil samtidig kunne opsætte særskilte egenskaber for baggrunden på BODY TAG'en:
BODY, P, TD {font-size: 12px; color: #003434; font-family: 'arial', sans-serif; }
BODY {background-color: #32bb32; }
Hermed vil du være bedst muligt sikret ved at få en løsning, der vil kunne anvendes i både Explorer og i Netscape browsere.
For tekstområder der skal have separat baggrundsfarve, kan du anvende indsætning af teksten i en tabel, hvor du giver tabelcellen de egenskaber du vil have. Dermed vil du også sikre dig en ensartet fremtoning uanset hvilken af de to browsere der bliver anvendt.
| For denne celle er ovenstående baggrundsegenskaber oprettet som en class i det anvendte stylesheet: .tdBag {background-color: #32bb32; } samt indsat på cellen: <TD class="tdBag"> |
| Til top |
Linieskift og vandrette linier
Linieskift anvendes, hvor der ikke skal være afstand mellem de enkelte linier men hvor yderligere tekst skal komme på den umiddelbart følgende linie. Linieskift indsættes som en BR TAG - break.
Vandrette linier - <HR> - kan indsættes efter behov og anvendes typisk i forbindelse med adskillelse af forskellige områder i et dokument. Det kan være to tekstområder der skal adskilles eller det kan være af andre rent designmæssige årsager, at der indsættes vandrette linier.
For vandrette linier er der mulighed for at sætte bredden i pixel eller i procent ligesom det er muligt at angive liniehøjden i pixel. Det er ligeledes muligt at højrejustere, centrere eller venstrejustere vandrette linier, der ikke fylder hele skærmens bredde. Som udgangspunkt er der i de fleste designprogrammer indlagt en 3D skygge på linien men denne kan fjernes, hvis det ønskes.
En højrestillet linie, 80% bred, uden 3D-effekt og 5 pixel høj, vil se således ud:
<hr width="80%" size="5" noshade align="right">
| Til top |