2. Text

start || föregående || nästa

Det finns ett stort antal taggar för att hantera, gruppera och presentera text. Här tar vi upp några av de viktigaste/vanligaste. Samtliga av dessa ska ligga i dokumentkroppen, dvs. mellan body-taggarna.

(Observera. När vi visar element som ska ligga i dokumentkroppen så visar vi inte html- och head-taggarna. Dessa ska dock alltid finnas med i dokumentet så som visade i första kapitlet.)

Headings: <h></h>

Det finns sex olika rubrikstorlekar som används i html, Dessa presenteras med h-taggen. Den skrivs som <hn></hn>, där n är rubrikstorleken. Dessa numreras från 1 och neråt, dvs. 1 är den största rubriken och 6 är den minsta.

Ex.

<body>
   <h1>rubrik 1</h1>
   <h2>rubrik 2</h2>
   <h3>rubrik 3</h3>
   <h4>rubrik 4</h4>
   <h5>rubrik 5</h5>
   <h6>rubrik 6</h6>
</body>

ger utskriften:

rubrik 1

rubrik 2

rubrik 3

rubrik 4

rubrik 5

rubrik 6

Paragraph: <p></p>
Det vanligaste sättet att dela in text i stycken är med p-taggen. P-taggen avgränsar ett stycke mot omliggande text, samt inleder med en blankrad. Ex. <body> Det här är standardtext... <p> ...och här är lite mer text. </p> </body> ger utskriften: Det här är standardtext... ...och här är lite mer text.

Division: <div></div>

Div-taggen används för att göra ett stycke text enhetligt. Denna används oftast tillsammans med formatmallegenskaper. Genom att gruppera text innanför div-taggarna och tilldela div-taggen en egenskap så får hela stycket egenskapen. Div-taggen infogar en radbrytning, men inte en blankrad.

Ex.

<body>
   Det här är standardtext...
   <div style="color: blue;">
      ...och här är lite mer text.
   </div>
</body>

ger utskriften:

Det här är standardtext...

...och här är lite mer text.

Span: <span></span>

Span-taggen används på samma sätt som div-taggen. Men den definerar bara att en viss mängd text hör ihop, den infogar inga radbrytningar. Den används också normalt främst för att tilldela text formatmallsegenskaper.

Ex.

<body>
   Det här är standardtext...
   <span style="color: blue;">
      ...och här är lite mer text.
   </span>
</body>

ger utskriften:

Det här är standardtext... ...och här är lite mer text.

Blockquote: <blockquote></blockquote>

Blockquote-taggen används för att på stilistiskt sätt presentera ett längre citat. Den infogar blankrad före- och efter området och gör både vänster- och högerindrag.

Ex.

<body>
   Det här är standardtext...
   <blockquote>
      ...och här är ett citat.
   </blockquote>
</body>

ger utskriften:

Det här är standardtext...

"...och här är ett citat."

Code: <code></code>
Code-taggen används för att återge text som ska representera datakod. Det som skiljer codetexten från vanlig text är att den har fast teckenbredd. Ex. <body> Det här är standardtext... <code> ...och här är kodtext. </code> </body> ger utskriften: Det här är standardtext... `...och här är kodtext.`

Strong: <strong></strong>
Strong-taggen används för att återge text som ska framhävas som tydligare. Text som är omgiven av strong-taggarna skrivs ut som fetstil. Ex. <body> Det här är standardtext... <strong>...och här är fetstil.</strong> </body> ger utskriften: Det här är standardtext... ...och här är fetstil.

Emphasis: <em></em>
Em-taggen återger text med speciell innebörd. Text omgiven av em-taggarna visas som kursiv. Ex. <body> Det här är standardtext... <em>...och här är kursiv text.</em> </body> ger utskriften: Det här är standardtext... ...och här är kursiv text.

Break: <br />

Break-taggen infogar en radbrytning. Ett break gör en radbrytning, ytterligare ett break ger ett blankrad. Observera att br-taggen inte har någon slut tag, utan att den avslutas direkt i sin start-tagg med ett snedstreck.

Ex.

<body>
   Det här är lite text...
<br />
   ...och här är lite mer text...
<br />
<br />
   ...och här är ytterligare lite text.
</body>

ger utskriften:

Det här är lite text...
...och här är lite mer text...

...och här är ytterligare lite text.