|
Opgave 2 : Typografier
|
| Formål |
Overskrifttypografi og skriftstørrelser
|
| Opret et nyt html-dokument
navngiv og gem
|
- Åbn Notesblok og opret et nyt html-dokument, med koderne :
<html>
<head>
<title> Opgave 2 </title>
</head>
<body>
</body>
</html>
- Inden vi går videre kan du ligeså godt gemme filen i din mappe med
navnet 'opgave-2.html'
|
overskrift <h1>
Headings <h1> til <h6>
|
- Skriv nu følgende efter dit <body> tag :
Overskriftstypografi
- Indsæt nu før ordet 'Overskrifttypografi ' dette tag <h1>
og efter ordet lukker du taget med
</h1>
- skrive herefter følgende : jeg skal nu lære at anvende
'overskrifttypografier / headings'
- Check resultatet i din browser ...
Dette er en fast overskrift typografi som giver store overskrifter. Koden kan bruges med tallene 1-6, som giver forskellige skriftstørrelser, hvor <h1> er den
største skrifttype og <h6> den mindste. Dem skal du prøve at anvende nu .
Skriv nu følgende :
|
husk at anvende
Copy (CTRL +C) ->
Paste (CTRL+V)
så du ikke skal skrive den samme kode igen og igen |
<H1>Heading 1</H1>
<H2>Heading 2</H2>
<H3>Heading 3</H3>
<H4>Heading 4</H4>
<H5>Heading 5</H5>
<H6>Heading 6</H6>
|
eksempel:
|
 |
|
Se resultatet... |
- Gem nu din html-fil , og check resultatet med din browser
Hvad gør heading-tag'et , udover at ændre skriftstørrelsen ?
|
| FONT SIZE 1-7
husk at anvende
Copy (CTRL +C) ->
Paste (CTRL+V)
så du ikke skal skrive den samme kode igen og igen |
En anden måde at ændre skriftstørrelse på - uden at der indsættes
en tom linje og teksten formateres med fed, er ved at anvende koden:
<font size="xx ">.
Det skal du prøve nu.
- Skriv følgende efter dine Headings :
<font size="1">font size 1</font>
<font
size="2">font size 2</font>
<font
size="3">font size 3</font>
<font
size="4">font size 4</font>
<font
size="5">font size 5</font>
<font
size="6">font size 6</font>
<font
size="7">font size 7</font>
|
| Linjeskift <br/> |
- Indsæt nu linjeskift mellem de 7 skriftstørrelser... ja hvordan var det nu ... se
opgave 1
- Gem nu filen igen - og åben den med Explorer og se resultatet....
|
| mere tekst og linjeskift |
Skriv evt. et par linjer mere i din opgave-2 fil , idet du bruger linjeskift på
de enkelte linjer.
|
