[successivo] [precedente] [inizio] [fine] [indice generale] [indice ridotto] [indice analitico] [volume] [parte]


Capitolo 486.   Testo

Alcune proprietà riferite al testo sono descritte nella tabella successiva. Si tratta in particolare dell'allineamento orizzontale, del rientro e dell'altezza della riga.

Tabella 486.1. Proprietà riferite al testo.

Proprietà Valori Descrizione
vertical-align
baseline
Testo al livello normale.
middle
Allinea al centro.
sub
Pedice.
super
Apice.
text-transform
none
Nessuna trasformazione del testo.
capitalize
Rende maiuscola la prima lettera delle parole.
uppercase
Tutto maiuscolo.
lowercase
Tutto minuscolo.
text-align
left
Allinea a sinistra.
right
Allinea a destra.
center
Centra.
justify
Allinea a sinistra e a destra.
text-indent
npt
Rientro in punti.
ncm
Rientro in centimetri.
nmm
Rientro in millimetri.
nem
Rientro relativo in quadratoni.
nex
Rientro relativo in Ex.
n%
Rientro relativo in percentuale.
line-height
normal
Altezza normale della riga.
npt
Altezza in punti.
ncm
Altezza in centimetri.
nmm
Altezza in millimetri.
n%
Altezza relativa in percentuale.

486.1   File «testo-css-01.html»

Si realizzi il file testo-css-01.html con il contenuto seguente, partendo da una copia del file colori-css-01.html:

      1 <!DOCTYPE HTML PUBLIC "ISO/IEC 15445:2000//DTD HTML//EN">
      2 <HTML LANG="it">
      3 <HEAD>
      4     <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=us-ascii">
      5     <META NAME="Description" CONTENT="Caratteristiche del testo,
      6         esempio 01">
      7     <META NAME="Keywords" CONTENT="HTML, CSS, testo, esempio">
      8     <META NAME="Author" CONTENT="Tizio Tizi, tizio@brot.dg, classe 4Z">
      9     <META NAME="Date" CONTENT="2007.01.01">
     10     <META NAME="Resource-type" LANG="en" CONTENT="Document">
     11     <META NAME="Revisit-after" LANG="en" CONTENT="15 days">
     12     <META NAME="Robots" CONTENT="ALL">
     13     <TITLE>Linguaggio CSS</TITLE>
     14     <STYLE TYPE="text/css">
     15         <!--
     16             BODY {
     17                 line-height:      15mm;
     18             }
     19             H1 {
     20                 font-size:        10mm;
     21                 text-transform:   uppercase;
     22             }
     23             P {
     24                 font-size:        5mm;
     25                 text-align:       justify;
     26             }
     27         -->
     28     </STYLE>
     29 </HEAD>
     30 <BODY>
     31 
     32 <H1>H&auml;nsel e Gretel</H1>
     33 
     34 <P>di Jacob e Wilhelm Grimm</P>
     35 
     36 <P>Davanti a un gran bosco abitava un povero taglialegna
     37 con sua moglie e i suoi due bambini; il maschietto si chiamava
     38 H&auml;nsel e la bambina Gretel. Egli aveva poco da metter sotto i
     39 denti, e quando ci fu nel paese una grande carestia, non poteva neanche
     40 pi&ugrave; procurarsi il pane tutti i giorni. [...]</P>
     41 
     42 <P>Per la fame, neppure i due bimbi potevan dormire, e avevano udito
     43 quel che la matrigna diceva al padre. Gretel piangeva amaramente, e
     44 disse a H&auml;nsel: - Adesso per noi &egrave; finita. - [...]</P>
     45 
     46 <P>[...]</P>
     47 
     48 </BODY>
     49 </HTML>

Figura 486.3. Aspetto del file testo-css-01.html.

testo-css-01.html

486.2   Verifica sull'uso delle proprietà riferite al testo

In base a quanto appreso fino a questo punto, si realizzi il file verifica-testo-css-01.html che produca un risultato abbastanza simile a quello mostrato di seguito, quando viene visto attraverso un navigatore:

Figura 486.4. Aspetto del file verifica-testo-css-01.html.

verifica-testo-css-01.html

Le maiuscole all'inizio di ogni parola sono ottenute attraverso una proprietà, mentre nel sorgente HTML il testo è scritto normalmente.

Si completi l'intestazione, coerentemente, secondo il proprio criterio, seguendo le modalità già stabilite. Inoltre, lo stile CSS deve essere incorporato nel file HTML. Si deve consegnare per la valutazione:

  1. la stampa del risultato ottenuto attraverso il navigatore;

  2. la stampa del sorgente.

Si richiede espressamente che tutti gli elementi, a esclusione di quelli che devono essere vuoti, siano terminati correttamente con il marcatore di chiusura.

Appunti di informatica libera 2007.02 --- Copyright © 2000-2007 Daniele Giacomini -- <daniele (ad) swlibero·org>


Dovrebbe essere possibile fare riferimento a questa pagina anche con il nome testo.htm

[successivo] [precedente] [inizio] [fine] [indice generale] [indice ridotto] [indice analitico]

Valid ISO-HTML!

CSS validator!