Anteprima
Vedrai una selezione di 4 pagine su 14
Informatica di base - HTML e applicazioni web Pag. 1 Informatica di base - HTML e applicazioni web Pag. 2
Anteprima di 4 pagg. su 14.
Scarica il documento per vederlo tutto.
Scarica
Informatica di base - HTML e applicazioni web Pag. 6
Anteprima di 4 pagg. su 14.
Scarica il documento per vederlo tutto.
Scarica
Informatica di base - HTML e applicazioni web Pag. 11
1 su 14
D/illustrazione/soddisfatti o rimborsati
Disdici quando
vuoi
Acquista con carta
o PayPal
Scarica i documenti
tutte le volte che vuoi
Estratto del documento

Formattazione del testo

I paragrafi di testo normale sono delimitati dai tag <P> e </P>

Testo normale, che si può eventualmente estendere su diverse righe.

Gli a-capo nel testo non vengono considerati: quando il browser impagina il testo si occupa lui di sistemarlo e di mandarlo a capo nei punti opportuni.

Notare che per ottenere le lettere accentate occorre usare codici speciali:

In altre parole, non è detto e anzi è improbabile che sulla pagina visualizzata ci sarà un a-capo fra "eventualmente" ed "estendere".

D'altra parte, questo è naturale se si pensa che la finestra del browser può essere ridimensionata: il browser deve poter riaggiustare il testo per occupare lo spazio nel modo più efficiente.

Per cambiare l'allineamento dei paragrafi si può introdurre

È &Egrave; un attributo del tag P. Un attributo è qualcosa che viene scritto dopo il nome del tag e ne specifica un aspetto. Per allineare un paragrafo si usa l'attributo align, nel modo seguente:

Testo normale, Testo normale, che si può che si pu&ograve; eventualmente eventualmente estendere su diverse estendere su diverse righe.

Testo normale, Testo normale, che si può che si pu&ograve; eventualmente eventualmente estendere su diverse estendere su diverse righe.

Testo Testo normale, che si può normale, che si può eventualmente eventualmente estendere su diverse estendere su diverse righe.

Testo normale, Testo normale, che si può che si pu&ograve; eventualmente eventualmente estendere su diverse estendere su diverse righe.

Alla fine di un paragrafo, il testo va a

Un altro tag per forzare un a-capo, anche se non siamo alla fine di un paragrafo, è il tag
(line BReak).

Questo è un tag che esiste solo nella versione "inizio" (non esiste il tag
).

PARTI DEL TESTO CON SPECIALI FUNZIONI

... : testo enfatizzato

... : testo ancora più enfatizzato (p.es. se per viene usato il corsivo per viene usato il neretto).

... : testo citato da altra fonte

Esempio: HTML Risultato

Testo normale, Testo normale, che si può che si può eventualmente eventualmente estendere su estendere su diverse righe.

differenti righe.

LISTE ED ELENCHI

Un elenco numerato (o "ordinato") si crea con il tag

    ...
(Ordered List). Gli elementi dell'elenco si indicano con il tag
  • , che non è necessario chiudere.

    Esempio: HTML

    1. Il mio primo elemento,
    2. il successivo,
    3. e infine l'ultimo,
    Un elenco non numerato si crea con il tag
      ...
    (UnorderedList). Gli elementi dell'elenco si indicano nuovamente con il tag
  • , che non è necessario chiudere. Esempio: HTML Risultato
    • Il mio primo elemento,•
    • il successivo,•
    • e infine l'ultimo,
    Per creare un elenco di elementi con descrizioni, si usa una DescriptionList, tag
    ...
    . Una description list ha due tipi di elementi: - elementi che indicano un titolo: tag
    (Description Title)• - elementi che esplicitano una descrizione: tag
    (Description Data)• Non è necessario chiuderli. Esempio: HTML Risultato
    Pavone
    Un uccello che fa la ruota
    Pinguino
    Un uccello che nuota
    Pulcinella di mare
    Un uccello che nuota, simile al pinguino. Il pulcinella di mare però sa anche volare

    TABELLE

    Le tabelle si descrivono come segue:

    dati casella 1 1 dati casella 1 2
    dati casella 2 1 dati casella 2 2

    Ossia:

    Inizio e fine tabella sono segnati con i tag <TABLE> ... </TABLE>

    Inizio e fine di ogni riga della tabella sono segnati con i tag <TR> ... </TR>

    All'interno di ogni riga, le celle sono segnate con i tag <TD> ... </TD>

    inizio e fine dei dati contenuti in una casella sono segnati con i tag ... (Table Data). ELEMENTI GRAFICI Le immagini non si possono mettere in un file HTML. Le immagini che vediamo in una pagina web sono file separati. Il browser li richiede al server web, come fa con le pagine HTML. Tali file vengono citati nel codice HTML. Il browser li visualizza all'interno della pagina, posizionati e dimensionati in modo opportuno. Il tag HTML per fare questo è (IMmaGine). Questo tag non ha la versione "fine" e richiede necessariamente di specificare almeno un attributo, senza il quale non ha senso: tale attributo è l'indirizzo del file immagine. Altri attributi che posso mettere sono: WIDTH impone la larghezza; HEIGHT l'altezza. Se impongo uno dei due, l'altro viene Formattazione del testo

    Il testo può essere formattato utilizzando i tag HTML. Ad esempio, se voglio impostare il testo in grassetto, posso utilizzare il tag <strong>...</strong>. Se invece voglio impostare il testo in corsivo, posso utilizzare il tag <em>...</em>.

    Un altro elemento grafico che possiamo utilizzare è l'immagine. Possiamo inserire un'immagine utilizzando il tag <img>. Possiamo specificare l'URL dell'immagine, le dimensioni e l'allineamento. Ad esempio, se voglio inserire un'immagine allineata a sinistra con una larghezza di 200 pixel, posso utilizzare il seguente codice:

    <img src="url_immagine.jpg" alt="Descrizione immagine" width="200" align="left">

    Il valore "url_immagine.jpg" deve essere sostituito con l'URL effettivo dell'immagine che si desidera utilizzare. È possibile specificare anche l'altezza dell'immagine, calcolata per mantenere le proporzioni originali. Se impongo entrambe le dimensioni, posso variare anche le proporzioni. ALIGN impone l'allineamento orizzontale, come per il testo. VALIGN l'allineamento verticale rispetto alla riga in cui si trova l'immagine: TOP oppure MIDDLE oppure BOTTOM.

    Un altro elemento grafico è la riga orizzontale. Si usa il tag <hr> (Horizontal Rule). Si può specificarne la larghezza, anche in proporzione alla pagina: <hr width="100"> oppure <hr width="70%">

    COLLEGAMENTI IPERTESTUALI

    I collegamenti ipertestuali si indicano nel seguente modo. Si sceglie una parte della pagina che deve essere cliccabile. Per esempio, per inserire un collegamento che consente di tornare alla home page, si renderà cliccabile il testo "Home page". Questo testo è la nostra ancora, ossia il punto a cui si aggancia il collegamento. Lo marchiamo quindi con il tag <a>...</a> (Anchor). Anche questo tag non ha senso senza

    <a href="http://www.disi.unige.it">Home page</a> <html> <head> <title>Pagina di esempio</title> </head> <body> <h1>Esempio di pagina HTML</h1> <h2>Scopo</h2> <p>Questa pagina è una pagina di prova che serve ad illustrare i tag HTML che abbiamo visto.</p> <h2>Consigli</h2> <p>Occorre essere <strong>rigorosi</strong> quando si scrive in HTML, perché il browser perdona molti errori e quindi non ci accorgiamo di averli fatti finché non succede qualcosa.</p> <p align="center"><em>È particolarmente noioso scrivere le tabelle. È consigliabile farsi prima un disegno su

    carta.

    Tre aspetti

    Si può notare che un documento (e quindi anche una pagina web) si deve guardare sotto tre distinti aspetti:

    1. Il contenuto
    2. Le parti del testo
    3. L'impaginazione

    Questi aspetti possono essere descritti come segue:

    Contenuto
    La sostanza del documento
    Parti del testo
    Come il contenuto è logicamente suddiviso
    Impaginazione
    Che aspetto hanno le varie parti del documento.

    Chi fa cosa?

    • L'autore decide il contenuto
    • L'autore o l'editor decide la suddivisione logica
    • Il browser si occupa dell'estetica

    eventualmente aggiungendo immagini come la seguente:



    e link ipertestuali come quello che va

    allahome page del DISI

    9Quello che segue è la visualizzazione di questa pagina su un particolare browser che fa particolari scelte estetiche. È importante ricordare che HTML prevede solo di indicare al browser il ruolo delle varie parti del documento. Spetta poi al browser scegliere l'estetica di tali parti. Un modo per influire su questa scelta si chiama CSS o Cascading Style Sheets. Un file CSS è una serie di regole che riguardano le scelte estetiche. È buona norma tenere tali scelte distinte dal contenuto e dalla struttura logica. Quindi si fa un file CSS separato. Applicazioni web Applicazione = Programma applicativo. 10 Applicazione web = estensione di un programma applicativo che si utilizza attraverso il www. Quando un'applicazione deve essere usata da molte persone, la soluzione tradizionale era il mainframe: un grosso calcolatore centrale congrandi capacità di archiviazione e di connessione, scarse capacità di puro elaborazione, solide garanzie di resistenza ai guasti. Al mainframe ci si collegava attraverso linee telefoniche o rete dedicata usando un terminale. Un terminale è poco più di una tastiera + un monitor. Un mainframe può supportare da 1000 a 10000 terminali. Quando i calcolatori piccoli (PC) sono diventati grandi, e capaci di elaborazione e collegamenti, si sono affiancati al calcolatore principale.
    • Dettagli
    Publisher
    flaviael
    A.A. 2007-2008
    14 pagine
    1 download
    SSD Scienze matematiche e informatiche INF/01 Informatica
    I contenuti di questa pagina costituiscono rielaborazioni personali del Publisher flaviael di informazioni apprese con la frequenza delle lezioni di Informatica di base e studio autonomo di eventuali libri di riferimento in preparazione dell'esame finale o della tesi. Non devono intendersi come materiale ufficiale dell'università Università degli Studi di Bologna o del prof Tomasi Francesca.