Che Cosa è un Ipertesto??
|
|
|
- Gastone Grassi
- 5 anni fa
- Visualizzazioni
Transcript
1 Che Cosa è un Ipertesto?? Con il termine IPERTESTO definiamo un documento la cui struttura di consultazione non è lineare, cioè le parti di cui è logicamente costituito ( capitoli, paragrafi, ) sono organizzati secondo una struttura complessa collegate per relazioni ( link ) e non solo in successione. Pag Cosa è la MULTIMEDIALITA?? Con il termine MULTIMEDIALITA definiamo l insieme di tecnologie il cui obiettivo è la gestione integrata dei dati basati su MEDIA differenti. In un documento multimediale possiamo trovare i seguenti tipi di dati : - testi - immagini - immagini animate - suoni - programmi L unione di IPERTESTI con DATI MULTIMEDIALI ha generato l IPERMEDIA. Pag
2 HyperTtextMarkupLanguage - Linguaggio di contrassegnazione utilizzato per la programmazione" in rete. - Per poter creare un documento in linguaggio HTML bisogna possedere : 1 - Un qualsiasi editor di testo 2 - Un browser in grado di leggere tale formato di testo. - Ogni documento creato con questo linguaggio" deve avere estensione HTM o HTML. - All'interno di questi documenti vi troviamo delle "parole chiave" dette TAG interpretate dal browser come comandi - I tag sono facilmente identificabili in quanto racchiusi sempre tra i segni di minore (<) e maggiore (>). Pag I TAG BASE DEL LINGUAGGIO HTML - Ogni file HTML deve iniziare con il tag <HTML> e deve terminare con il tag </HTML> - Indica al browser che la parte di file compreso appartiene al linguaggio HTML. - Il tag <HEAD> </HEAD> Indica che la parte di testo compresa fa parte dell intestazione del documento. Generalmente in questa sezione si trova solamente il titolo del testo. - Il tag <TITLE> </TITLE> Serve per creare un titolo che appaia nella barra dei titoli del browser. Pag
3 I TAG BASE DEL LINGUAGGIO HTML - L'ultimo tag importante è: <BODY> </BODY> comunica al browser l'inizio del corpo del documento (si può omettere). Consente di definire: 1 - Il colore di sfondo 2 - Il colore del testo 3 L inserimento di un immagine come sfondo. Pag I TAG BASE DEL LINGUAGGIO HTML 1 - Per specificare il colore dello sfondo si utilizza il tag <BODY BGCOLOR="#colore"> dove colore è la notazione esadecimale del colore da utilizzare. Ad esempio, <BODY BGCOLOR= #0000ff > specifica che il colore di sfondo è il blu. 2 - Per specificare il colore del testo si deve utilizza il tag <BODY TEXT="#colore"> dove colore è la notazione esadecimale del colore da utilizzare. Ad esempio : <BODY TEXT="#ffff00 > specifica che il colore del testo deve essere il giallo. Pag
4 I comandi per manipolare testo. Tutti i tag seguenti devono essere chiusi in quanto hanno effetto solo sulle parole comprese tra l'inizio del tag e la sua chiusura. <I> :serve a scrivere un testo in Italico (cioè così) <B> :serve a scrivere un testo in grassetto (cioè così) <U> :serve a scrivere un testo sottolineato (cioè così) <S> : serve a scrivere un testo barrato (cioè così) <SUP> : serve a scrivere un testo in apice (cioè così ) <SUB> : serve a scrivere un testo in pedice (cioè così ) <EM> : serve a dare più importanza ad una parte del testo (così) <STRONG> : serve a dare ancora più importanza ad una parte dei testo (così) <CODE> e <TT> : anche se sono due tag diversi, in pratica hanno lo stesso effetto, fanno comparire il testo monospaziato (cioè tutte le lettere hanno la stessa larghezza). Pag IL TAG Hx - Il tag <Hx> </Hx> consente di definire la grandezza del testo che si vuol far apparire nel documento. La x rappresenta un numero compreso tra 1 e 6 che identifica la grandezza del testo che viene specificato di seguito. Maggiore è il numero sostituito alla x, più piccolo sarà il carattere utilizzato per scrivere il testo specificato. N.B. Questo tag manda automaticamente a capo il testo quando ne modifica la dimensione. Pag
5 IL TAG Hx Esempio: <BODY> <h1> Testo grandissimo <h2> Testo grande <h3> Testo medio-grande <h4> Testo medio-piccolo <h5> Testo piccolo <h6> Lo vedete ancora? </BODY> Pag IL TAG FONT Il tag <FONT > </FONT> è combinato con altri tag e serve a specificare vari parametri relativi al testo. I principali sono 1 - la grandezza del testo (con il tag SIZE) 2 - il colore del testo (con il tag COLOR). Pag
6 IL TAG SIZE Il tag SIZE accoppiato al tag FONT permette di variare la dimensione del testo. Esempio: <FONT SIZE=x> testo </FONT> Il testo che comparirà di seguito al tag, verrà scritto MOOOLTO grande se il valore di x è un numero alto (massimo 7), oppure MOOOLTO piccolo se il numero è 1 (numero minimo), Finché il tag FONT non viene chiuso le modifiche applicate al testo resteranno attive (cioè finché non viene incontrato il tag </FONT>, il testo verrà scritto della dimensione specificata). N.B. Il vantaggio dell'utilizzo di tale tag al posto di <Hx> consiste nel fatto di non mandare a capo il testo qualora si variasse la dimensione del carattere. Pag IL TAG COLOR. Il tag COLOR accoppiato al tag FONT permette di variare il colore del testo. Anche in questo caso le modifiche resteranno attive fintanto che non verrà chiuso il tag FONT. Esempio <FONT COLOR="#FFFFFF > testo </FONT> Il colore ottenuto è il giallo. Il colore del testo viene ottenuto mescolando i colori : 1 ROSSO 2 VERDE 3 - BLU Pag
7 IL TAG COLOR. I browser utilizzano la notazione esadecimale per determinare la quantità dei colori primari da mescolare per ottenere il colore desiderato : - il valore minimo per ogni componente è 0 (00 in notazione esadecimale), - il valore massimo è 255 (FF in notazione esadecimale). Nel nostro esempio : 1 - le prime due cifre rappresentano la quantità di ROSSO 2 - le due seguenti la quantità di VERDE 3 - le ultime due la quantità di BLU. Mescolando queste tre componenti si possono ottenere più di 16 milioni di colori. Pag I paragrafi. - Il tag <BR> indica al browser di andare a capo prima di visualizzare la parte di testo che segue il tag. Tale tag non necessita di chiusura, per cui è sufficiente scrivere <BR> e poi il resto della frase. - Il tag <P> </P> permette la creazione e la chiusura di un paragrafo. Il tag <P> offre anche la possibilità di definire l'allineamento del paragrafo (cioè se il testo deve essere allineato sul lato destro o sinistro del documento) se usato in coppia al tag ALIGN : <P ALIGN xxx>, dove al posto delle tre x va specificato uno dei seguenti attributi: 1 - LEFT : il testo compare allineato a sinistra 2 - RIGHT : il testo compare allineato a destra 3 - CENTER : il testo compare centrato 4 -JUSTIFY : il testo compare allineato su entrambi i lati Pag
8 Come dare vita al testo. Con Internet ExpIorer si può sfruttare un ulteriore tag (che non è però riconosciuto da Netscape Navigator) il cui scopo è quello appunto di dare vita al testo, cioè di fare in modo che una porzione di testo si muova in una certo direzione o altro. Tale tag è MARQUEE e la sua sintassi è: Gli attributi specificabili sono: <MARQUEE attributi> 1. ALIGN=xxx : che permette di selezionare la posizione del testo all'interno della casella animata. I valori accettabili sono : 1 - TOP che fa scorrere il testo in alto 2 - BOTTOM che fa scorrere il testo in basso 3 - MIDDLE che fa scorrere il testo al centro. Pag Come dare vita al testo. 2. BEHAVIOR - determina l'effetto da dare al testo. Può assumere tre valori diversi che sono : 1 - SCROLL, con cui il testo scorre da un margine all'altro; 2 - SLIDE, con cui il testo scorre da un margine, ma si ferma non appena raggiunto quello opposto; 3 - ALTERNATE, con cui il testo rimbalza tra le due "pareti" del documento. 2. BGCOLOR: permette di specificare il colore dello sfondo della casella di testo animato (il colore deve essere espresso nella stesso forma utilizzato per il tag font color) 3. DIRECTION, specifica la direzione del testo. Può assumere solo due valori : 1 - LEFT che fa scorrere il testo verso sinistra e 2 - RIGHT che fa scorrere il testo verso destra 4. SCROLLDELAY: determina l'attesa tra la visualizzazione di un "fotogramma" e il successivo (il valore indica quanti millisecondi attendere) Pag
9 Come dare vita al testo. 5. LOOP: determina quante volte ripetere ciò che è specificato dagli altri parametri. Il valore deve essere un numero compreso tra 1 e INFINITE (che ha lo stesso significato di -l). Con uno, l'operazione verrà ripetuta una sola volta; con INFINITE (o -l) all'infinito 7. HEIGHT: determina l'altezza della casella di testo 8. HSPACE: determina la distanza tra i margini della casella di testo animato e i margini del documento (il numero indica quanti pixel) 9. VSPACE: determina la distanza tra il marquee e i margini verticali del documento (il numero indica quanti pixel) Pag Box e Tabelle Vediamo ora un altro elemento di importanza notevole nella realizzazione delle pagine HTML: - Il tag <TABLE> </TABLE> definisce l'inizio e la fine di una tabella. Per creare la tabella vera e propria invece, esistono due tag appositi : - Il tag <TR> </TR> consente di creare una riga e va chiuso quando si vuole terminarla. Pag
10 Box e Tabelle - Il tag <TD> </TD> consente di creare una colonna e va chiuso quando si vuole terminarla. Per comprendere meglio quanto detto, basta dare un'occhiata all'esempio riportato di seguito: <table border= 1 > <tr> <td> A </td> <td> B </td> </td> </tr> </table> Digitando il listato riportato qui sopra, otteniamo una tabella con una sola riga ma due colonne. Per ogni riga aggiuntiva che si vuole creare, si dovrà aggiungere un <TR>... </TR> che ha appunto questo compito. Pag Box e Tabelle Altri attributi del tag TABLE : <TABLE BORDER= x > permette di definire la presenza o meno dei bordi che delimitano le celle e il loro spessore, x rappresenta un numero che identifica di quanti pixel deve essere lo spessore dei bordi. <TABLE BORDERCOLOR="colore"> permette di definire il colore da assegnare al bordo delle celle (qualora presente), dove colore rappresenta una configurazione esadecimale che identifica il colore (come visto nella sezione relativa al testo). N.B. Una tabella creata con i soli tag visti in precedenza, però ha il difetto di cambiare le proprie dimensioni qualora venisse modificato il carattere con cui viene scritto il testo nelle celle o venisse modificata la dimensione della finestra del browser. Pag
11 Box e Tabelle Per ovviare all inconveniente precedente esiste l'attributo WIDTH da aggiungere al tag TD, in questo modo si specifica la larghezza della cella. La sintassi è: <Td WIDTH= pixel"> dove pixel rappresenta la larghezza, in pixel, che deve assumere la cella. Il tag TD accetta inoltre tutti i vari tag, relativi al testo (cioè il cambio della dimensione dei font, del colore, dell'allineamento dei paragrafi ecc.). I browser, per default, allineano il testo della cella verticalmente (cioè è al centro): qualora si volesse modificare tale parametro, si può ricorrere al tag VALIGN che accetta i seguenti valori: <TR VALIGN=TOP> per avere il testo spostato verso l'alto <TR VALIGN=MIDDLE> per avere il testo centrato <TR VALIGN=BOTTOM> per avere il testo spostato verso il basso Pag Quale immagini posso utilizzare? LE IMMAGINI - Non tutti i formati grafici sono supportati dal linguaggio HTML, ma solo un limitato numero. Gli unici due, per quanto riguarda il mondo Windows/Ms-Dos, sono GIF e JPEG, che hanno il vantaggio di occupare poco spazio e di conseguenza rendere più facile e veloce il caricamento della pagina da parte del browser. Come si utilizzano le immagini - Il linguaggio HTML, ci permette di fare uso delle nostre immagini mettendoci a disposizione il tag <IMG>, che non necessita di chiusura e ammette i seguenti attributi: 1 - SRC (obbligatorio) : specifica il nome dell'immagine da caricare. 2 - ALIGN (facoltativo): permette di definire in quale posizione deve apparire il testo di seguito all'immagine. Pag
12 LE IMMAGINI Ammette i seguenti valori: 1 - BOTTOM (cioè il testo sarà visualizzato all'estremità inferiore dell'immagine), 2 - MIDDLE (il testo sarà posto a metà dell'immagine). 3 - TOP (il testo sarà posto all'inizio dell'immagine). N.B. Se non viene specificato l'attributo ALIGN, il browser assumerà ALIGN=BOTTOM per default. Se si specificano invece i valori LEFT o RIGHT, sarà l'immagine ad essere allineata sul margine sinistro o destro del documento. 3 - ALT (facoltativo): è necessario se si vuole che al posto dell'immagine appaia un testo alternativo nel caso che il browser utilizzato per visualizzare la pagina non preveda l'utilizzo di immagini. 4 - WIDTH (facoltativo): imposta la larghezza dell'immagine da visualizzare (cioè permette di vedere un immagine più stretta o più larga di quanto sia effettivamente). 5 - HEIGHT (facoltativo): specifica l'altezza dell'immagine da visualizzare. 6 - UNITS (facoltativo) : specifica l'unità di misura per i due attributi precedenti. Pag I LINK Cos è un Link? Link, in inglese, vuol dire collegamento, ed è proprio questa la funzione che svolgono i link in un documento HTML - collegano. Possono collegare un documento HTML ad un altro documento HTML, ad un paragrafo all'interno dello stesso documento, ad un filmato, ad un sito o a tutto ciò che ci passa per la mente. Noi ci occuperemo principalmente di due tipi di link: 1. I link che collegano tra loro file HTML 2. I link alle immagini Pag
13 Come si crea un link? - Il tag <A> </A> abbreviazione della parola inglese anchor, cioè ancora. Il suo utilizzo è abbastanza semplice infatti, in linea di massima, basta specificare tra l'apertura e la chiusura del tag, il nome del file a cui fa riferimento il link. Ad esempio, supponiamo di aver creato un file chiamato HOME.HTM, e di voler inserire al suo interno un link al file TESTO.HTM. Per fare questo bisogno inserire, nel punto in cui si vuole far comparire il link, il tag A nel seguente modo: Pag Come si crea un link? <A HREF= testo.htm"> testo del link </A> dove HREF indica al browser che il collegamento si riferisce ad un file HTML e testo.htm è il nome del file a cui il link fa riferimento (che può contenere anche la specificazione delle directory) testo del link" invece, deve essere sostituito dalla frase o dalla parola che si vuoi far comparire come pulsante" del link (nel senso che cliccando su tale frase, verrà attivato il link); solitamente la frase che rappresenta un link è riconoscibile perché scritta in un colore diverso dal testo normale ed inoltre è sottolineata. E possibile fare in modo che i link non siano identificati solamente da testo, ma anche da una immagine, infatti basta sostituire al testo del link, un collegamento ad una immagine, seguendo le regole viste prima. Pag
14 <HTML> ***** IL TAG "HTML" INDICA L'INIZIO DI UN FILE HTML ***** IL TAG "BR" INDICA AL BROWSER DI ANDARE A CAPO <HEAD> </HEAD> FILE ***** IL TAG "HEAD" INDICA L'INIZIO DELL'INTESTAZIONE DEL FILE ***** IL TAG "/HEAD"INDICA LA FINE FINE DELL'INTESTAZIONE DEL <TITLE> ***** IL TAG "TITLE" CREA UNA FRASE NELLA BARRA DEI TITOLI </TITLE> <BODY> ***** INIZIO CORPO DEL DOCUMENTO <BODY BGCOLOR="#0000FF"> ***** IL TAG "BODY BGCOLOR="DEFINISCE IL COLORE DELLO SFONDO (BLU) Pag <BODY TEXT ="#FFFF00"> ***** IL TAG "BODY TEXT=" DEFINISCE IL COLORE DEL TESTO (GIALLO) IL TAG "I" DEFINISCE <I>TESTO ITALICO </I> IL TAG "B" DEFINISCE <B>TESTO IN GRASSETTO </B> IL TAG "U" DEFINISCE <U>TESTO SOTTLINEATO </U> IL TAG "S" DEFINISCE <S>TESTO BARRATO </U> IL TAG "SUP" DEFINISCE <SUP>TESTO IN APICE</SUP> IL TAG "SUB" DEFINISCE <SUB>TESTO IN PEDICE</SUB> IL TAG "EM" DEFINISCE <EM>IMPORTANZA AD UNA PARTE DEL TESTO</EM> IL TAG "STRONG" DEFINISCE <STRONG>PIU' IMPORTANZA AD UNA PARTE DEL TESTO</STRONG> IL TAG "CODE" DEFINISCE <CODE>TESTO CON TUTTE LE LETTERE DELLA STESSA LARGHEZZA </CODE> IL TAG "TT" DEFINISCE <TT>TESTO CON TUTTE LE LETTERE DELLA STESSA LARGHEZZA </TT> Pag
15 <H1>TESTO GRANDISSIMO</H1> <H2>TESTO GRANDE</H2> <H3>TESTO MEDIO GRANDE</H3> <H4>TESTO MEDIO PICCOLO</H4> <H5>TESTO PICCOLO</H5> <H6>TESTO PICCOLISSIMO</H6> <FONT SIZE=1> testo piccolissimo - </FONT> <FONT SIZE=2> testo piccolo - </FONT> <FONT SIZE=3> testo medio piccolo - </FONT> <FONT SIZE=4> testo medio grande - </FONT> <FONT SIZE=5> testo grande - </FONT> <FONT SIZE=6> testo molto grande - </FONT> <FONT SIZE=7> testo grandissimo - </FONT> **** COME SI PUO' NOTARE MENTRE IL TAG "Hx" MANDA A CAPO IL TESTO **** IL TAG "FONT SIZE=x" NON LO FA' <FONT COLOR="#00FFFF"> ***** IL TAG "FONT COLOR=" DEFINISCE IL COLORE DEL TESTO (AZZURRO) MA SOLO SE RACCHIUSO TRA IL TAG INIZIALE E FINALE E PUO' ESSERE USATO CON IL "FONT SIZE" </FONT> <P align=center>il TAG "P ALIGN=CENTER" DELIMITA E CENTRA UN PARAGRAFO</P> <P align=left>il TAG "P ALIGN=LEFT" DELIMITA E MARGINA A SINISTRA UN PARAGRAFO</P> <P align=right>il TAG "P ALIGN=RIGTH" DELIMITA E MARGINA A DESTRA UN PARAGRAFO</P> Pag <P align=justify>il TAG "P ALIGN=JUSTIFY" DELIMITA E MARGINA IN MODO GIUSTIFICATO UN PARAGRAFO, OSSIA MARGINA IL PARAGRAFO SIA A DESTRA CHE A SINISTRA</P> <marquee behavior=scroll> CON IL TAG "MARQUEE BEHAVIOR SCROLL" IL TESTO SCORRE DA UN MARGINE ALL'ALTRO </marquee> <marquee behavior=alternate> CON IL TAG "MARQUEE BEHAVIOR ALTERNATE" IL TESTO RIMBALZA DA UN MARGINE ALL'ALTRO </marquee> <marquee behavior=slide> CON IL TAG "MARQUEE BEHAVIOR SLIDE" IL TESTO SCORRE DA UN MARGINE E SI FERMA IN FONDinO </marquee> Pag
16 <TABLE BORDER="1"> <tr> **** DEFINISCE L'INIZIO DI UNA TABELLA **** CREA UNA RIGA <td width="80"> A </td> **** CREA UNA COLONNA DI LARGHEZZA 80 <td width="40"> B </td> **** CREA UNA COLONNA DI LARGHEZZA 40 <td width="20"> C </td> **** CREA UNA COLONNA DI LARGHEZZA 20 <td width="10"> D </td> **** CREA UNA COLONNA DI LARGHEZZA 10 </tr> </table> **** CHIUDE UNA RIGA **** DEFINISCE LA FINE DI UNA TABELLA <br><br> <img align=top src="file://c:/mauro/ima/19.jpg"> <font color="#ffff00" > TOP </font> <br><br> <a href="file://c:/mauro/ima/2.jpg"> <font color="#ffff00" > BOTTOM **** DEFINISCE UN LINK ALLA FIGURA Pag </font> </a> <br><br> <img align=middle src="file://c:/mauro/ima/20.jpg"> <font color="#ffff00" > MIDDLE </font> <br><br> </body> <br><br> </html> ***** FINE CORPO DEL DOCUMENTO ***** INDICA LA FINE DI UN FILE HTML Pag
Formattazione di liste
Formattazione di liste Con HTML si possono costruire liste puntate o numerate: Occorre definire l inizio e la fine della lista e poi definire ogni singolo elemento della lista. Le liste numerate si costruiscono
Corso di HTML. Prerequisiti. Modulo L3 3 Blocchi di testo
Corso di HTML Modulo L3 3 Blocchi di testo 1 Prerequisiti Formattazione di un testo Struttura a titoli di un testo Giustificazione e allineamento del testo 2 1 Introduzione In questa Unità vediamo altri
APPUNTI DI INFORMATICA IL LINGUAGGIO HTML
APPUNTI DI INFORMATICA IL LINGUAGGIO HTML Vediamo le seguenti istruzioni dell HTML link permette di dare un colore alla nostra "parola calda", se questo attributo non viene esplicitato
HTML Guida base. Guida grafica essenziale all Hyper Text Markup Language I parte
HTML Guida base Guida grafica essenziale all Hyper Text Markup Language I parte In questa breve guida imparerai come è fatta la struttura della pagina HTML impostare il titolo della pagina impostare lo
Ogni documento HTML è contraddistinto dai seguenti comandi di base, che ne definiscono la struttura:
COMANDI BASE HTML Ogni documento HTML è contraddistinto dai seguenti comandi di base, che ne definiscono la struttura: Nome del documento All'interno
HTML Lezione2 Le Immagini e i link. Prof. Accarino IIS Altiero Spinelli Via Leopardi 132 Sesto San Giovanni
HTML Lezione2 Le Immagini e i link Prof. Accarino IIS Altiero Spinelli Via Leopardi 132 Sesto San Giovanni Le immagini I formati supportati dal websono diversi e variano a seconda del browser adoperato.i
Il tag MARQUEE. L opzione ALIGN
Il tag MARQUEE 1 Internet Explorrer offre ai creatori Web un modo facile per inserire una sezione di testo animato in una pagina. In particolare sarà possibile visualizzare una parola o una frase che si
Il linguaggio HTML. <html> </html> I documenti HTML vanno racchiusi dentro una coppia di TAG (marcatori): apertura e chiusura.
Il linguaggio HTML I documenti HTML vanno racchiusi dentro una coppia di TAG (marcatori): apertura e chiusura. . I tag devono essere racchiusi dentro parentesi acute Il tag di chiusura
Linguaggio HTML. Elementi di Informatica e Programmazione Università degli Studi di Brescia. Il Linguaggio HTML
Reti Linguaggio HTML 1 Il Linguaggio HTML n HTML = Hypertext Markup Language n Linguaggio di markup di tipo descrittivo (usato per descrivere e formattare documenti ipertestuali) con una sintassi prestabilita
INTRODUZIONE AL LINGUAGGIO HTML: PARTE 2. Internet + HTML + HTTP = WWW
1 INTRODUZIONE AL LINGUAGGIO HTML: PARTE 2 Internet + HTML + HTTP = WWW Scopo della esercitazione 2 Conoscere i principali tag HTML Realizzare una propria Home Page utilizzando alcuni semplici tag HTML
non è linguaggio di markup formato testo .htm .html interpretando
HTML Gli ipertesti del web sono scritti usando il linguaggio HyperText Markup Language (HTML). HTML non è un linguaggio di programmazione! HTML non ha meccanismi per prendere delle decisioni o compiere
Tabelle HTML. Tabelle Un po di notazione.
Tabelle HTML!! Le tabelle in HTML permettono di rappresentare tabelle di dati ", ma anche di formattare del testo, delle immagini, altre tabelle in righe e colonne, possono cioè essere usate per l impaginazione
Creazione di tabelle.
Creazione di tabelle. Argomenti trattati: - Premessa: Cosa sono le tabelle in HTML. - Costruiamo una tabella: Come realizzare semplici tabelle con i tag principali ed i loro attributi. - Personalizziamo
Informatica. Comunicazione & DAMS A.A. 2015/16. Dr.ssa Valeria Fionda
Informatica Comunicazione & DAMS A.A. 2015/16 Dr.ssa Valeria Fionda Pagina Web Struttura base pagina Web: (Heading
Tipi di testo. Esempio 4. Enfasi. Inserire immagini. Esempio 5 INFO WEB LEZIONE N.4
Tipi di testo INFO WEB LEZIONE N.4 RAVENNA, 13 MARZO 2008 All interno di un documento HTML è possibile inserire due tipi di testo Titoli Sei livelli di grandezza , ,, Paragrafi
APPUNTI DI HTML (QUARTA LEZIONE)
APPUNTI DI HTML (QUARTA LEZIONE) 1. LA STRUTTURA BASE DELLE TABELLE Le tabelle sono una parte estremamente importante del codice HTML. Sono uno strumento indispensabile per gestire i layout grafici. Immaginiamo
Introduzione. Elementi di Informatica. Standard. Struttura dei TAG - 1. Annidamento e Indentazione. Struttura dei TAG - 2
Università degli Studi di Udine Facoltà di Ingegneria CORSO DI LAUREA IN SCIENZE dell ARCHITETTURA Elementi di Informatica HTML e CSS D. Gubiani HTML è l acronimo di HyperText Markup Language che tradotto
HTML 3. Liste puntate ed ordinate Immagini
HTML 3 Liste puntate ed ordinate Immagini Creazione di elenchi Elenchi puntati (elenchi non ordinati) Elenchi numerati (elenchi ordinati) Elenchi annidati Elenchi menu Elenchi glossario Tecnologie di Sviluppo
Corso di HTML. Prerequisiti. Modulo L2 B3-Immagini. Creazione di pagine web Visualizzazione pagine web. M. Malatesta B3-Immagini-05 09/01/2014
Corso di HTML Modulo L2 B3-Immagini 1 Prerequisiti Creazione di pagine web Visualizzazione pagine web 2 1 Introduzione In questa Unità diamo un approfondimento dell utilizzo del tag del linguaggio HTML
HTML Lezione3 Le Tabelle. Prof. Accarino IIS Altiero Spinelli Via Leopardi 132 Sesto San Giovanni
HTML Lezione3 Le Tabelle Prof. Accarino IIS Altiero Spinelli Via Leopardi 132 Sesto San Giovanni Le Tabelle Non servono soltanto per incolonnare e tabulare i dati come si potrebbe facilmente pensare. Le
Serve per impostare. enfatizza il testo (l effetto è quello del grassetto, comando utile per i motori di ricerca) <ul> comandi relativi all immagine
Comandi principali HTML Serve per impostare il titolo della pagina (nella sezione head) il font del titolo 1 il font del titolo 2 paragrafo una o più parole alle quali applicare
LEZIONE NO. 3: LE TABELLE DI ATTILIO ABBIEZZI
HTML BASE LEZIONE NO. 3: LE TABELLE DI ATTILIO ABBIEZZI 1 gestire Tabelle La larghezza e l'altezza complessiva di una tabella viene indicata all'interno dell'attributo , il quale appunto
Corso di HTML. Prerequisiti. Modulo L2 B4 - Le tabelle. Concetto di tabella Coordinate di cella in una tabella. M. Malatesta B4-Le tabelle-06
Corso di HTML Modulo L2 B4 - Le tabelle 1 Prerequisiti Concetto di tabella Coordinate di cella in una tabella 2 1 Introduzione In questa Unità illustriamo il concetto e l uso delle tabelle in HTML. Le
HTML. I tag HTML (parte 1)
HTML I tag HTML (parte 1) I tag HTML I comandi che il browser interpreta Etichette per marcare l inizio e la fine di un elemento HTML Formato e possono essere tag di apertura: tag di chiusura:
Linguaggi di programmazione PC server-client CSS
Linguaggi di programmazione PC server-client CSS HTML MySQL PHP HTML: Hyper Tex Markup Language PHP: Hypertext Preprocessor CSS: Cascading Style Sheet MySQL: Relational database HTML Hyper Tex Markup Language
HTML. Es: La prossima parola è in <b>neretto</b> Es: La prossima parola è in neretto
HTML Il linguaggio HTML (HyperText Markup Language) utilizza annotazioni (tag) per descrivere come verrà visualizzato il documento sul browser di un client. L HTML non è un linguaggio di programmazione
HTML. Es: La prossima parola è in <b>neretto</b> Es: La prossima parola è in neretto
HTML Il linguaggio HTML (HyperText Markup Language) utilizza annotazioni (tag) per descrivere come verrà visualizzato il documento sul browser di un client. HTML non è un linguaggio di programmazione ma
HTML 5. Tabelle. Bordi di una tabella. Il tag <TABLE> Le tabelle. Tag fondamentali. Costruzione di tabelle riga per riga. Esempi
HTML 5 Tabelle Tag fondamentali Costruzione di tabelle riga per riga Le tabelle Esempi 1 Tecnologie di Sviluppo per il WEB 2 Il tag Una tabella è suddivisa in righe e ciascuna riga è suddivisa
CSS 6. Il modello contenitore (box model) Elementi flottanti
CSS 6 Il modello contenitore (box model) Elementi flottanti Il modello contenitore Tecnologie di Sviluppo per il WEB 2 BOX MODEL CSS assume che ogni elemento genera uno o più box rettangolari, chiamati
Le liste non ordinate
Le liste non ordinate Semplici elenchi preceduti da un pallino: segnala l inizio della lista precede ogni voce Attributi: disc(standard), square(quadrato pieno), circle(quadrato
Laboratorio Digitale 1
Informatica Corso di PROGRAMMAZIONE Applicata ai Beni IN Culturali RETE Laboratorio Digitale 1 Corso di Laboratorio Digitale 1 Corso di laurea comunicazione e DAMS Laurea Specialistica - Media Education
Pablo Genova I. I. S. Angelo Omodeo Mortara Indirizzo Tecnico-Economico A. S
Breve introduzione all' HTML Pablo Genova gallini.genova@gmail.com I. I. S. Angelo Omodeo Mortara Indirizzo Tecnico-Economico A. S. 2017 2018 Un assaggio di HTML Come abbiamo visto nelle lezioni precedenti
STRUTTURA BASE DELLA PAGINA HTML
INDICE INDICE... 1 Convenzioni e simboli usati... 1 STRUTTURA BASE DELLA PAGINA HTML... 1 Alcuni dei Principali TAG Html:... 2 Gli attributi dei TAG Html:... 2 ALIGN... 2 attributi del tag ... 2
Tag <br> : per definire l interruzione di riga (andata a capo)(senza tag di chiusura); sta per break row
TAG FONDAMENTALI Tag : per definire l interruzione di riga (andata a capo)(senza tag di chiusura); sta per break row Tag , tag ,.tag : per definire le intestazioni (i titoli) e la loro
Tabelle. Tag fondamentali. Costruzione di tabelle riga per riga. Esempi. Tecnologie di Sviluppo per il WEB 2
HTML 5 Le tabelle 1 Tabelle Tag fondamentali Costruzione di tabelle riga per riga Esempi Tecnologie di Sviluppo per il WEB 2 Il tag Una tabella è suddivisa in righe e ciascuna riga è suddivisa
CSS: HTML: Proprietà per la formattazione delle immagini Immagini di sfondo e sfondi multipli. Le immagini mappate
CSS: Proprietà per la formattazione delle immagini Immagini di sfondo e sfondi multipli HTML: Le immagini mappate 1 Le principali proprietà che permettono di manipolare le immagini agiscono sul box mode
IMMAGINI INTRODUZIONE
IMMAGINI INTRODUZIONE Prima di inserire le immagini nella pagina HTML, le stesse devono essere copiate all interno della cartella del progetto (Sito). La loro copia può avvenire o tramite Risorse del Computer
HTML Guida di riferimento
Dipartimento di Elettronica ed Informazione Politecnico di Milano Informatica A - GES Prof. Plebani A.A. 2006/2007 HTML Guida di riferimento La presente dispensa e da utilizzarsi ai soli fini didattici
CSS: stili e layout BOX MODEL. Prof.ssa Cristina Gena
CSS: stili e layout BOX MODEL Prof.ssa Cristina Gena Box model In questa lezione vedremo la differenza tra gli elementi blocco e gli elementi in linea e scopriremo le caratteristiche del box model. In
HTML Sesta lezione. 29 Marzo di Ivano Stranieri
HTML 4.01 Sesta lezione 29 Marzo 2004 di Ivano Stranieri 0 Lezione precedente Costruire una tabella Raggruppare righe (e colonne) Unire righe e colonne Attributi di e Come utilizzare
Linguaggio per ipertesti
Linguaggio per ipertesti Un linguaggio per descrivere gli ipertesti è l HyperText Markup Language (HTML) Non è il solo (VRML,XML,...) l HTML è un linguaggio di formattazione e permette di formattare del
Web. HyperText Markup Language
Web HyperText Markup Language HTML HyperText Markup Language permette la creazione di documenti multimediali ipertestuali è il linguaggio per la creazione di pagine web non è l unico: PHP, JavaScript,
Informatica di Base Laboratorio di HTML Dott. Serena Villata A.A. 2004/05
Informatica di Base Multid@ms Laboratorio di HTML Dott. Serena Villata A.A. 2004/05 1 Che cos è l HTML? Hyper Text Markup Language Definisce le caratteristiche stilistiche di un documento, non è programmazione!
HTML. Hyper Text Mark-Up Language
HTML Hyper Text Mark-Up Language Cos è l HTML? È un linguaggio usato per descrivere documenti ipertestuali disponibili nel Web È un linguaggio di marcatura del testo che descrive il contenuto e il formato
Informatica (Sistemi di elaborazione delle informazioni)
Informatica (Sistemi di elaborazione delle informazioni) Corso di laurea in Scienze dell'educazione Lezione 4 HTML Mario Alviano Sommario Internet Paragrafi Caratteri Titoli Liste puntate e numerate Collegamenti
Introduzione al linguaggio HTML
Introduzione al linguaggio HTML 1 Richiami introduttivi (1) sito Internet (sito Web o sito WWW) insieme delle pagine che si riferiscono ad uno stesso utente, argomento o azienda, registrate su un server
Pablo Genova I. I. S. Angelo Omodeo Mortara Indirizzo Tecnico-Economico A. S
Breve introduzione all' HTML Pablo Genova gallini.genova@gmail.com I. I. S. Angelo Omodeo Mortara Indirizzo Tecnico-Economico A. S. 2018 2019 Un assaggio di HTML Come abbiamo visto nelle lezioni precedenti
<!-- TESTO DEL COMMENTO
Il corpo della pagina: il tag Come abbiamo già avuto modo di osservare, il tag definisce ed identifica il corpo della pagina, cioè la "porzione visibile" di un qualsiasi documento HTML. Avendo
Corso di PROGRAMMAZIONE IN RETE
Corso di PROGRAMMAZIONE IN RETE Laurea Specialistica - Media Education Dr. Annamaria Bria 1 1 Dipartimento di Matematica Università della Calabria Riferimenti MANUALE http://www.w3.org/tr/1999/rec-html401-19991224/
Le tabelle vengono usate quando hai bisogno di mostrare dei "dati tabulari" cioè informazioni presentate logicamente in righe e colonne.
Le tabelle Le tabelle vengono usate quando hai bisogno di mostrare dei "dati tabulari" cioè informazioni presentate logicamente in righe e colonne. E' difficile? All'inizio costruire le tabelle in HTML
Progettazione multimediale
Progettazione multimediale Le tabelle 1 Obiettivi Perché si usano le tabelle Le proprietà delle tabelle Inserimento e modifica delle proprietà 2 Perché si usano le tabelle Una pagina Web è formata da testo
Tabelle. Esempio 20. Inserire righe e colonne. Dimensioni delle tabelle. Attributi del tag TABLE INFO WEB LEZIONE N.6
Tabelle INFO WEB LEZIONE N.6 RAVENNA, 2 APRILE 2008 In HTML le tabelle vengono largamente utilizzate per organizzare i dati in tabelle creare il layout della pagina servendosi di tabelle nascoste Si definiscono
Introduzione all HTML
prof. ing. Dino Molli SVILUPPO SOFTWARE - FORMAZIONE E CONSULENZA INFORMATICA MARIGLIANO (NA) http://www.dinomolli.it info@dinomolli.it Dispense a cura del prof. ing. Dino Molli Introduzione all HTML Introduzione
layout senza tabelle Posizionamento con i CSS Ad ogni elemento HTML corrisponde un area rettangolare, detta box Contenuto
Posizionamento con i CSS creare layout senza tabelle 1 Gestione degli elementi della pagina Il box model Ad ogni elemento HTML corrisponde un area rettangolare, detta box Margine Bordo Area di padding
STILE E CSS. classi sezioni. tag
Perchè occorre lo stile? HTML con i suoi tag e relativi attributi possiede un suo stile standard che offre purtroppo poche personalizzazioni. Un sito web deve avere uniformità di colori, di font e dimensioni
HTML. Es: La prossima parola è in <b>neretto</b> Es: La prossima parola è in neretto
HTML Il linguaggio HTML (HyperText Markup Language) utilizza annotazioni (tag) per descrivere come verrà visualizzato il documento sul browser di un client. HTML non è un linguaggio di programmazione ma
Il tag MAP e i suoi attributi
C.S.F. En.A.I.P. Cuneo Corso: I O.S.P.A. Laboratorio: Elementi di grafica per il web N scheda 5 Titolo Esercitazione / Argomento trattato Il tag IMG e i suoi attributi Il tag MAP e i suoi attributi h previste:
Zoom è una Pagina web multimedia che si crea accedendo al seguente menù: File > Nuova pagina web multimedia > Zoom (figura 1).
Zoom è una che si crea accedendo al seguente menù: File > Nuova pagina web multimedia > Zoom (figura ). Figura È una pagina che permette all'utente di esplorare un immagine tramite uno zoom. Per questa
HTML - ESERCITAZIONE 1
HTML - ESERCITAZIONE 1 Impostazione - sfondo formattazione 1. Costruisci un file di testo e salvalo come pagina web (con estensione.htm) col nome: Cognome Nome 01. 2. Inserisci nella giusta posizione i
HTML 4.01 Seconda lezione
HTML 4.01 Seconda lezione A cura di Ivano Stranieri 0 Lezione precedente Cos è internet browser editor di testo HTML: cos è e cosa non è i marcatori i tag di struttura: DOCTYPE HTML HEAD TITLE META BODY
CSS. Esercizi CC BY ALESSANDRO URSOMANDO DIAPOSITIVA 2 CSS PROPRIETÀ
CSS Esercizi CSS PROPRIETÀ DIAPOSITIVA 2 Corredare l esercizio precedentemente realizzato di un file.css che presenti delle dichiarazioni per impostare: l ampiezza del body a 800 pixel a giallo chiaro
a cura di Romina Biava HTML IMMAGINI ELENCHI TABELLE LINK FRAME FORM STRUTTURA DI UNA PAGINA HTML
a cura di Romina Biava HTML IMMAGINI ELENCHI TABELLE LINK FRAME FORM STRUTTURA DI UNA PAGINA HTML Le pagine web consistono in una "testa", in inglese head e un "corpo", detto anche body.
Creare un sito web in html. Creare un sito web in html Prof.ssa Amalia Di Giacomo
Creare un sito web in html Cosa impareremo Cos è una pagina web Come strutturare una pagina web Formattazione del testo Link e menù di navigazione Inserire immagini Motori di ricerca (posizionamento dei
HTML. Linguaggio testuale formato da TAG, che consente il collegamento tra diversi file.
Con la sigla HTML si intende: HYPER TEXT MARKUP LANGUAGE HTML Linguaggio testuale formato da TAG, che consente il collegamento tra diversi file. Iper testo Un documento o pagina puo essere collegato ad
Una pagina web inizia sempre con il tag <html> e si conclude con il tag </html> : ogni elemento che compone la pagina sarà racchiuso tra essi.
HTML per semplici pagine web HTML è l acronimo di Hypertext Markup Language ( Linguaggio di contrassegno per gli Ipertesti ) e NON è un linguaggio di programmazione E un linguaggio che permette di indicare
Silvia Likavec. Lezione 6
Silvia Likavec Lezione 6 2 ! Le principali proprietà che permettono di manipolare le immagini agiscono sul box model: " Border (o border-style; border-width; bordercolor); " Padding; " Margin; " Width;
HTML. Hyper Text Mark-Up Language
HTML Hyper Text Mark-Up Language Presentazione HTML by Maria Grazia Maffucci is licensed under a Creative Commons Attribuzione - Non commerciale - Condividi allo stesso modo 3.0 Unported License. Cos è
body e i suoi tag HTML 2
body e i suoi tag HTML 2 Il tag BODY Indica il corpo del testo Attributi (uso deprecato) BGCOLOR = #rrggbb sfondo TEXT = #rrggbb testo LINK = #rrggbb link VLINK = #rrggbb link visitato ALINK
Tabella: struttura di base
Tabella: struttura di base Le tabelle sono una delle parti più importanti di tutto il codice HTML: nate sin dagli inizi del Web per impaginare dati aggregati, si sono poi trasformate in uno strumento indispensabile
Scrivere in Html Tag e loro attributi
Scrivere in Html Tag e loro attributi + Esercizi Prof.ssa Daniela Zangirolami Tutti i diritti sono riservati. Qualsiasi riproduzione, anche parziale, senza autorizzazione scritta è vietata. Legge 633 del
Guida al linguaggio HTML (HyperText Markup Language)
1 Guida al linguaggio HTML (HyperText Markup Language) Guida al linguaggio HTML (HyperText Markup Language) Sommario Guida al linguaggio HTML (HyperText Markup Language)... 1 1. Struttura di una pagina
Il linguaggio HTML - Parte 5
Corso IFTS Informatica, Modulo 3 Progettazione pagine web statiche (50 ore) Il linguaggio HTML - Parte 5 Dott. Chiara Braghin braghin@dti.unimi.it Frame I frame (cornici) permettono di suddividere la finestra
MACROSTRUTTURA DEL DOCUMENTO HTML. Il documento HTML si divide in due parti: l INTESTAZIONE e il CORPO DEL DOCUMENTO
MACROSTRUTTURA DEL DOCUMENTO HTML Il documento HTML si divide in due parti: l INTESTAZIONE e il CORPO DEL DOCUMENTO Denominazione Nome del marcatore Descrizione Documento All'inizio e alla
Pagina web multimedia Lettore File video
Lettore File video è una che si crea accedendo al seguente menù: File > Nuova pagina web multimedia > Lettore > File video (figura ). Figura Lettore File video è un lettore di tracce video in formato MP4
Piccolo tutorial per TimelineJS
Piccolo tutorial per TimelineJS Sommario Scaricare lo spreadsheet... 1 Modificare il file con i propri contenuti... 1 Lo spreadsheet passo passo... 2 La data... 2 Il corpo della slide... 2 Contenuti multimediali...
Primi passi con HTML. Il documento HTML
Primi passi con HTML. Il documento HTML La mia prima pagina in HTML Questo è il corpo del documento che stiamo realizzando. Questa non è una nuova riga.
caratteristiche del documento </head>
HTML: sintassi caratteristiche del documento documento 21 HTML: titolo del documento
3.6.1 Inserimento. Si apre la finestra di dialogo Inserisci Tabella:
3.6.1 Inserimento Per decidere dove collocare una tabella è necessario spostare il cursore nella posizione desiderata. Per inserire una tabella esistono diversi modi di procedere: Menù Tabella Inserisci
Corso Base Informatica Lezione 6. 14/03/18 Corso Base Informatica Windows
Corso Base Informatica Lezione 6 Nella Lezione Precedente Programmi in Windows 7 Software Libero e Software Proprietario Installazione di programmi liberi Esercizi con Wordpad, cartelle e file Rimozione
HTML 2. Il tag BODY. Nota. Esempio. body e i suoi tag
body e i suoi tag HTML 2 Il tag BODY Indica il corpo del testo Attributi (uso deprecato) BGCOLOR = #rrggbb sfondo TEXT = #rrggbb testo LINK = #rrggbb link VLINK = #rrggbb link visitato ALINK = #rrggbb
Cimini Simonelli - Testa
WWW.ICTIME.ORG HTML Manuale introduttivo al linguaggio HTML Cimini Simonelli - Testa v.2-11/01/2008 Sommario Introduzione... 3 Formattazione della pagina... 4 Inserire un colore di sfondo... 4 Inserire
SOMMARIO. Prefazione... XI. Capitolo 1 - Le variabili dell ambiente di progettazione Web... 1
Prefazione... XI Capitolo 1 - Le variabili dell ambiente di progettazione Web... 1 HTML, XML e il futuro dei linguaggi per il Web... 2 Il linguaggio HTML: una breve introduzione storica... 2 Il linguaggio
HTML Sintassi di HTML Tag principali per i contenuti I Forms
Lezione 1 HTML Sintassi di HTML Tag principali per i contenuti Tag principali per i contenuti I Forms L HTML (HyperText Markup Language) g è il linguaggio gg di markup utilizzato per veicolare le informazioni
MODULO 7 HTML HTML. HTLM (Hypertext Markup Language) è un linguaggio per la creazione di documenti ipertestuali e ipermediali
MODULO 7 HTML MODULO 6 - HTML 1 HTML HTLM (Hypertext Markup Language) è un linguaggio per la creazione di documenti ipertestuali e ipermediali Un sistema ipertestuale è un insieme di nodi connessi da collegamenti.
3.4 Inserimento di immagini
Ripristina per riportare ai valore iniziali la scheda in uso (la finestra di dialogo resta aperta). 3.4 Inserimento di immagini Per inserire un'immagine all'interno del documento: posizionare il cursore
HTML Tutorial HTML By A.C. Neve 1
HTML Tutorial HTML By A.C. Neve 1 Il linguaggio HTML (Hyper Text Markup Language) è il più diffuso linguaggio per la creazione di pagine WEB. La creazione di un documento HTML si effettua con un qualsiasi
Cl Calendario dl del corso
Cl Calendario dl del corso 12/02/2010 09.00-12.00 Introduzione al mondo WEB Concetti fondamentali e struttura di un sito e delle pagine pg web Gli URL, i link, le immagini I linguaggi HTML e CSS 16/02/2010
Visualizzare o modificare il codice sorgente del documento (per utenti avanzati,linguaggio HTML).
Manuale FckEditor In questa sezione è possibile avere una rapida panoramica su tutte le funzioni disponibili nella barra degli strumenti predefinita FCKeditor. Tale componente lo ritroverete in gestione
Attività interattiva Tabelle
Tutti gli esercizi interattivi propongono quattro schede per le impostazioni di funzionamento: Attività - Opzioni di esecuzione - Sito web - Scorm. Mentre la scheda Attività è ogni volta diversa ed è oggetto
Appunti sulle Tabelle
Appunti sulle Tabelle Prof. Riccardo conti Le pagine seguenti illustrano, attraverso semplici lezioni, come realizzare tabelle per le tue pagine Web. zatrabeoj I tre tag principali sono: E' il tag principale.
web 2.0 è una Pagina web multimedia che si crea accedendo al seguente menù: File > Nuova pagina web multimedia > Web 2.0 (figura 1).
web.0 è una che si crea accedendo al seguente menù: File > Nuova pagina web multimedia > Web.0 (figura ). Figura Web.0 offre un modo molto semplice per incorporare in un file di Ardora il codice embed
Elementi in HTML Un elemento è una componente fondamentale della struttura di un documento di testo. Alcuni esempi di elementi sono testate, tabelle,
HTML: introduzione HTML significa Hyper Text Markup Language I documenti HTML sono file plain-text (anche conosciuti come ASCII) che possono essere creati usando un qualsiasi text editor e possono essere
Comandi principali del linguaggio HTML (Hyper Text Markup Language)
Comandi principali del linguaggio HTML (Hyper Text Markup Language) Caratteristiche di HTML HTML è un linguaggio di formattazione (markup) di documenti ed è il linguaggio base per produrre documenti per
Come lo chiamiamo?..
Come lo chiamiamo?.. normalmente le formule sono criptiche = P.RATA(C10/12;C7*12;B11) = SUM(A10:A15)/B15 = A10*(1+$B$2) è possibile semplificare la comprensione con l uso dei nomi di riferimento a celle
INSERIMENTO. Un foglio di stile può essere esterno e interno: Un foglio esterno si carica: Un foglio interno può essere compilato
CSS I FOGLI DI STILE HTML serve informare il browser di quali sono le componenti necessarie a mostrare un documento e ad articolare il documento in blocchi semantici. I fogli di stile (Cascading Style
Conoscere HTML. Elementi HTML particolari In un documento HTML si possono inserire elementi con funzionalità particolari. 1 Il linguaggio HTML
Conoscere HTML 1 Il linguaggio HTML Abbiamo visto come le informazioni che si trovano in Internet siano memorizzate in pagine web. Queste sono raggiungibili quando se ne conosce l indirizzo o tramite collegamenti