HTML ELEMENTI CONTENITORI. Elementi contenitori. <body> Nel body ci sono elementi vari (testi, immagini, moduli...)
|
|
|
- Giustina Adamo
- 5 anni fa
- Visualizzazioni
Transcript
1 HTML Elementi contenitori [corso avanzato] HTML5 ELEMENTI ELEMENTI CONTENITORI <title> <head> Nel body ci sono elementi vari (testi, immagini, moduli...) <body> Oggi i siti organizzano lo spazio del body in alcune aree semantiche. HTML5 introduce degli elementi contenitoriper favorire questa organizzazione. DIAPOSITIVA 2 1
2 HEADER <title> <head> header Intestazione di una pagina o di un area specifica. Tipicamente contiene i tag h1/h6 e hgroup. <body> DIAPOSITIVA 3 HEADER <img src="logo.png" alt="save the children" /> <hgroup> <h1>save the children</h1> <h6>italia Onlus</h6> </hgroup> </header> header Intestazione di una pagina o di un area specifica. Tipicamente contiene i tag h1/h6 e hgroup DIAPOSITIVA 4 2
3 FOOTER <title> <head> footer Ogni pagina (o area) può avere informazioni conclusive quali: autore, link, informazioni di copyright, ecc. <body> DIAPOSITIVA 5 FOOTER footer Ogni pagina (o area) può avere informazioni conclusive quali: autore, link, informazioni di copyright, ecc. <strong> Save the Children dal 1919 lotta per i diritti dei bambini di tutto il mondo<br/> </strong> Save the Children Italia Credits <a href = " Via Volturno, Roma - Tel: (+39) Fax: (+39) <br/> Codice Fiscale Partita Iva C.C. POSTALE n </footer> DIAPOSITIVA 6 3
4 ASIDE <title> <head> aside Definisce un area laterale il cui contenuto è solo parzialmente correlato al tema principale (menu, link esterni, banner pubblicitari). <body> <aside> DIAPOSITIVA 7 ASIDE aside Definisce un area laterale il cui contenuto è solo parzialmente correlato al tema principale (menu, link esterni, banner pubblicitari). <aside> <a href=" <img src=" alt="aiuta un bambino adesso, Dona ora!" /> </a> <br/> <img src=" /> <br/> <embed </aside> src=" width="258" height="320" /> DIAPOSITIVA 8 4
5 ASIDE <title> <head> aside Definisce un area laterale il cui contenuto è solo parzialmente correlato al tema principale (menu, link esterni, banner pubblicitari). <body> <aside> Gli elementi header e footer possono essere in qualsiasi area. DIAPOSITIVA 9 ARTICLE <title> <head> article Definisce un area del sito che contiene un contenuto autonomo e completo che può essere eventualmente ridistribuito <article> <aside> DIAPOSITIVA 10 5
6 ARTICLE <title> <head> article Definisce un area del sito che contiene un contenuto autonomo e completo che può essere eventualmente ridistribuito <article> <aside> Gli elementi header e footer possono essere in qualsiasi area. DIAPOSITIVA 11 article Definisce un area del sito che contiene un contenuto autonomo e completo che può essere eventualmente ridistribuito Gli elementi header e footer possono essere in qualsiasi area. DIAPOSITIVA 12 6
7 SECTION <title> <head> section Definisce un area generica del sito <section> <aside> DIAPOSITIVA 13 SECTION <title> <head> section Definisce un area generica del sito <section> <aside> Gli elementi header e footer possono essere in qualsiasi area. DIAPOSITIVA 14 7
8 section Definisce un area generica del sito Gli elementi header e footer possono essere in qualsiasi area. Una sectionpuò contenere un article? E un articlepuò contenere una section? DIAPOSITIVA 15 SECTION VS ARTICLE Sectione articlesono contenitori semantici: raggruppano contenuti che possono essere visti come un tutt uno. Quindi nulla osta affinché si contengano l un l altro, fermo restando che in un articleci devono essere contenuti eventualmente ridistribuibili. Pensiamo ad esempio alla struttura di un blog DIAPOSITIVA 16 8
9 SECTION VS ARTICLE <article> Un post con tutti i suoi commenti DIAPOSITIVA 17 SECTION VS ARTICLE contenuto dell articolo Il post <article> <section> I commenti DIAPOSITIVA 18 9
10 SECTION VS ARTICLE contenuto dell articolo <article> <article> <article> Un commento <article> <section> <article> <section> Il formper inserire un nuovo commento DIAPOSITIVA 19 NAV <title> <head> <nav> nav Definisce il menu delle sezioni del sito L elemento navpuò essere sistemato in un elemento aside <section> <aside> DIAPOSITIVA 20 10
11 NAV <nav> <a href=" HOME </a> <a href="">cosa PUOI FARE TU</a> <a href="">cosa FACCIAMO</a> <a href="">informati</a> <a href="">chi SIAMO</a> </nav> nav Definisce il menu delle sezioni del sito DIAPOSITIVA 21 HTML I form 11
12 I FORM DAL PUNTO DI VISTA DELL UTENTE Un form(modulo) permette all utente di interagire con la pagina WEB. DIAPOSITIVA 23 I FORM DAL PUNTO DI VISTA DELL UTENTE L utente inserisce uno o più input e poi conferma premendo un tasto.. DIAPOSITIVA 24 12
13 I FORM DAL PUNTO DI VISTA DELL UTENTE..il browser reagirà in accordo con l input. DIAPOSITIVA 25 I FORM DAL NOSTRO PUNTO DI VISTA Una pagina WEB può avere uno o più elementi form. Gli elementi formnon sono mai annidati l uno nell altro. Ogni formpuò contenere svariati elementi di interazione e tra questi (di solito) c è almeno un pulsante di conferma. Ogni elemento di interazione ha un nome(nascosto all utente) e un valore. Ogni elemento form ha tre attributi: name, method ed action. Alla pressione del tasto di conferma viene eseguito il programma indicato in action al quale verranno spedite le coppie (nome, valore) con la strategia indicata in method. DIAPOSITIVA 26 13
14 I FORM DAL NOSTRO PUNTO DI VISTA Una pagina WEB può Ogni formpuò contenere svariati avere uno o più elementi form. elementi di interazione e tra questi (di solito) c è almeno un pulsante di conferma. L elaborazione può avvenire in due modi: Gli elementi formnon Lato client sono mai annidati l uno nell altro. Javascript Lato server Ogni PHP elemento di interazione ha un nome(nascosto all utente) e un valore. ASP Perl Java Ogni elemento form ha tre attributi: name, method ed action. Alla pressione del tasto di conferma viene eseguito il programma indicato in action al quale verranno spedite le coppie (nome, valore) con la strategia indicata in method. DIAPOSITIVA 27 TEXT E PULSANTI <p>cognome</p> <input type="text" name="cognome" /> <p>nome</p> <input type="text" name="nome" /> <input type="submit" value="ok" /> Tutti i campi di input possono avere l attributo value. <p>cognome</p> <input type="text" name="cognome" value="ursomando" /> <p>nome</p> <input type="text" name="nome" value="alessandro" /> <input type="submit" value="ok" /> DIAPOSITIVA 28 14
15 LABEL <p>cognome</p> <input type="text" value="ursomando" name="cognome" /> <p>nome</p> <input type="text" name="nome" /> <input type="submit" value="ok" /> <label for="cognome">cognome</label> <input id="cognome" type="text" name="cognome" /> <label for="nome">nome</label> <input id="nome" type="text" name="nome" /> <input type="submit" value="ok" /> Forse sarà meglio strutturare la nostra pagina HTML DIAPOSITIVA 29 LABEL <label for="cognome">cognome</label> <input id="cognome" type="text" name="cognome" /> <label for="nome">nome</label> <input id="nome" type="text" name="nome" /> <input id="btn" type="submit" value="ok" /> body { margin: 10px; } form { width: 208px; } div { margin: auto; } input { width: 100px; } label { display:inline-block; width: 100px; } input#btn { width: 150px; display: block; margin: 10px auto; } DIAPOSITIVA 30 15
16 PASSWORD <label for="username">nome Utente</label> <input id="username" type="text" name="username" /> <label for="passwd">password</label> <input id="passwd" type="password" name="passwd" /> <input type="submit" value="ok" id="btn"/> DIAPOSITIVA 31 RESET <label for="username">nome Utente</label> <input id="username" type="text" name="username" /> <label for="passwd">password</label> <input id="passwd" type="password" name="passwd" /> <input type="submit" value="ok" id="btn"/> <input type="reset" value="svuota form" id="btn"/> DIAPOSITIVA 32 16
17 RADIO BUTTON Per inserire un radio button nel nostro form useremo un elemento di tipo input con attributo type pari a radio. I radio buttondi uno stesso gruppo condividono il valore dell attributo namee si differenziano grazie all attributo value. <label> <input type="radio" name="colore" value="#000000" checked="checked"/> Default (nero) </label> <label> <input type="radio" name="colore" value="#ff0000" /> Rosso </label> <label> <input type="radio" name="colore" value="#00ff00" /> Verde </label> <label> <input type="radio" name="colore" value="#0000ff" /> Blu </label> <label> <input type="radio" name="colore" value="#ffff00" /> Giallo </label> <label> <input type="radio" name="colore" value="#00ffff" /> Ciano </label> <input id="btn" type="submit" value="invia Dati" /> DIAPOSITIVA 33 CHECK BOX Per inserire un checkbox nel nostro form useremo un elemento di tipo input con attributo type pari a checkbox. Ogni casella avrà il suo nome (name) e il suo valore (value). <label> <input type="checkbox" name="corso1" value="true" /> HTML <label> <input type="checkbox" name="corso2" value="true" /> CSS <label> <input type="checkbox" name="corso3" value="true" /> JAVASCRIPT <label> <input type="checkbox" name="corso4" value="true" /> PHP <input id="btn" type="submit" value="invia Dati" /> Anche qui è valido l attributo checked. </label> </label> </label> </label> DIAPOSITIVA 34 17
18 TEXTAREA <textarea name="commenti" cols="21" rows="5"> Testo da inserire dentro il textarea. </textarea> <input id="btn" type="submit" value="invia Dati" /> DIAPOSITIVA 35 MENU A TENDINA Un menu a tendina viene realizzato mediante l elemento select(che fornisce l attributo name) e i suoi elementi figlio option (che hanno i valori). <select name="sito"> <option value=" Vasco Rossi </option> <option value=" Jovanotti </option> <option value=" Ligabue </option> <option value=" 99posse </option> <option value=" 24Grana </option> </select> <input id="btn" type="submit" value="invia Dati" /> Possiamo specificare una voce attiva mediante l attributo selected DIAPOSITIVA 36 18
19 NUOVI TIPI DI INPUT HTML5 ha rivoluzionato i formintroducendo sia nuovi attributi che nuovi tipi di input. Tralasciamo gli attributi. Alcuni si sostituiscono a un lavoro che in passato andava fatto con Javascript: number range date time color Altri sono propri dell ambito mobile: search url DIAPOSITIVA 37 NUOVI TIPI DI INPUT: NUMBER <label for="number">una quantità</label> <input id="number" type="number" name="number" /> Qui possono essere utili gli attributi min, maxe step DIAPOSITIVA 38 19
20 NUOVI TIPI DI INPUT: RANGE <label for="range">un intervallo</label> <input id="range" type="range" name="range" /> Qui possono essere utili gli attributi min, maxe step DIAPOSITIVA 39 NUOVI TIPI DI INPUT: DATE <label for="date">una data</label> <input id="date" type="date" name="date" /> DIAPOSITIVA 40 20
21 NUOVI TIPI DI INPUT: TIME <label for="time">un orario</label> <input id="time" type="time" name="time" /> DIAPOSITIVA 41 NUOVI TIPI DI INPUT: COLOR <label for="color">un colore</label> <input id="color" type="color" name="color" /> DIAPOSITIVA 42 21
22 FIELDSET E LEGEND <fieldset> <legend>dati anagrafici</legend> <label for="nome">nome</label> <input id="nome" type="text" name="nome"/> <label for="cognome">cognome</label> <input id="cognome" type="text" name="cognome"/> <label for="datan">data di Nascita</label> <input id="datan" type="date" name="datan"/> </fieldset> Per raggruppare esteticamente più controlli sotto un unica etichetta possiamo usare gli elementi fieldset e legend. <fieldset> <legend>carta di credito</legend> <label for="numero" >Numero</label> <input id="numero" type="text" name="numero"/> <label for="datas">data di Scadenza</label> <input id="datas" type="date" name="datas"/> <label for="csv" >Numero CSV</label> <input id="csv" type="text" name="csv"/> </fieldset> DIAPOSITIVA 43 HIDDEN Presentiamo infine il controllo necessario ad aggiungere ai dati inseriti dall utente, eventuali dati inseriti dal programmatore. <input type="hidden" name="autore" value="alessandro Ursomando" /> DIAPOSITIVA 44 22
I moduli HTML Interazione per l invio di informazioni in Internet
I moduli HTML Interazione per l invio di informazioni in Internet Sviluppo di siti web UD09 Fablab Design Interazione e uso dei moduli Uno dei fattori che ha decretato il successo del Web è senz'altro
Laboratorio Progettazione Web PHP e FORMs HTML - Lezione 8. Andrea Marchetti IIT-CNR 2011/2012
Laboratorio Progettazione Web PHP e FORMs HTML - Lezione 8 Andrea Marchetti IIT-CNR andrea.marchetti@iit.cnr.ita 2011/2012 Architettura di una applicazione Web Browser Web HTTP Server Web Dati View Control
Il tag form indica l'inizio della costruzione di un modulo. Necessita del tag di chiusura
LE FORM Le form, note in italiano anche come moduli sono delle strutture che permettono all'utente di inserire dei dati o di effettuare delle scelte. Le form, prese singolarmente non sono nient'altro che
Modulo o Form in Html
Pagina dinamica E un documento contenente oggetti, dati e informazioni che possono variare anche in base all iterazione dell utente con il documento stesso. Un esempio classico è quello di una persona
Programmazione Web D B M G. Il linguaggio HTML
Programmazione Web Il linguaggio HTML Il linguaggio HTML Concetti di base Le interfacce utente in HTML I form Le tabelle Il passaggio dei parametri contenuti nei form HTML: HyperText Markup Language Standard
HTML e interattività FORM
HTML e interattività FORM Interattività delle pagine web I moderni siti web non sono più soltanto un insieme di pagine da leggere con testo e immagini, ma rappresentano uno strumento per interagire con
HTML 6. Il modulo. Tipi di controlli. Esempio di modulo. I moduli a.k.a. form
I moduli a.k.a. form HTML 6 Il modulo Un modulo è un'area della pagina predisposta per accettare dei dati in ingresso dall'utente Gli utenti forniscono dati al WEB server che restituisce una risposta (pagina
Programmazione Web D B M G. Il linguaggio HTML
Programmazione Web Il linguaggio HTML Il linguaggio HTML Concetti di base Le interfacce utente in HTML I form Le tabelle Il passaggio dei parametri contenuti nei form HTML: HyperText Markup Language Standard
D B M G. Basi di dati. Programmazione Web: HTML. Programmazione Web. Il linguaggio Politecnico di Torino 1
Programmazione Web Il linguaggio HTML Il linguaggio HTML Concetti di base Le interfacce utente in HTML I form Le tabelle Il passaggio dei parametri contenuti nei form @2011 Politecnico di Torino 1 Concetti
D B M G. Basi di dati. Programmazione Web: HTML. Programmazione Web. Il linguaggio Politecnico di Torino 1
Programmazione Web Il linguaggio HTML Il linguaggio HTML Concetti di base Le interfacce utente in HTML I form Le tabelle Il passaggio dei parametri contenuti nei form @2011 Politecnico di Torino 1 Concetti
04/05/2011. Lezione 6: Form
Lezione 6: Form In alcuni documenti HTML può essere utile creare dei moduli (form) che possono essere riempiti da chi consulta le pagine stesse (es. per registrarsi ad un sito). Le informazioni sono poi
HTML: CSS: Le proprietà di base per dare stile ai form
HTML: Elementi di base: caselle e aree di testo, radio button, checkbox, bottoni submit e reset, campi nascosti, file upload, menù di selezione. Accessibilità dei form: label, fieldset e legend, optgroup
D B M G Il linguaggio HTML
Programmazione Web Il linguaggio HTML Il linguaggio HTML Concetti di base Le interfacce utente in HTML I form Le tabelle Il passaggio dei parametri contenuti nei form @2011 Politecnico di Torino 1 Concetti
Form HTML. <form> campi del modulo </form>
Form HTML I form (o moduli) HTML permettono ad un utente di interagire con la pagina che sta visitando. L inserimento di un form in una pagina web avviene mediante il tag FORM. Attributi del form campi
@2011 Politecnico di Torino 1
Concetti di base Programmazione Web Il linguaggio HTML HTML consente di annotare un testo per contrassegnare le parti che lo compongono Le annotazioni sono realizzate tramite i "tag" Visualizzare documenti
HTML il linguaggio per creare le pagine per il web
HTML il linguaggio per creare le pagine per il web Parte II: elementi "complessi" HTML: frame i frame servono per suddividere il browser in parti indipendenti all interno delle quali si possono caricare
@2011 Politecnico di Torino 1
Il linguaggio HTML Programmazione Web Concetti di base Le interfacce utente in HTML I form Il passaggio dei parametri contenuti nei form Il linguaggio HTML Concetti di base Concetti di base HTML: HyperText
@2011 Politecnico di Torino 1
Il linguaggio HTML Programmazione Web Concetti di base Le interfacce utente in HTML I form Il passaggio dei parametri contenuti nei form Il linguaggio HTML Concetti di base Concetti di base HTML: HyperText
HTML il linguaggio per creare le pagine per il web
HTML: frame HTML il linguaggio per creare le pagine per il web Parte II: elementi "complessi" i frame servono per suddividere il browser in parti indipendenti all interno delle quali si possono caricare
HTML 6. I moduli a.k.a. form
HTML 6 I moduli a.k.a. form 1 Il modulo Un modulo è un'area della pagina predisposta per accettare dei dati in ingresso dall'utente Gli utenti forniscono dati al WEB server che restituisce una risposta
HTML Settima lezione. 7 Aprile di Ivano Stranieri
HTML 4.01 Settima lezione 7 Aprile 2004 di Ivano Stranieri 0 Lezione precedente Cosa sono i FRAME A cosa servono i FRAME Sintassi Attributi Collegamenti e NOFRAME IFRAME Vantaggi e svantaggi dei FRAME
HTML: FORM. Prof. Francesco Accarino IIS Altiero Spinelli Via Leopardi 132 Sesto San Giovanni
HTML: FORM Prof. Francesco Accarino IIS Altiero Spinelli Via Leopardi 132 Sesto San Giovanni Form Text Radio Select CheckBox TextArea Button ... L'elemento serve per delimitare un modulo
HTML Interazione con l utente
HTML Interazione con l utente Il web è interattivo e per questo motivo una pagina html deve prevedere la possibilità, per l'utente, di inviare informazioni o effettuare delle scelte. Il linguaggio HTML,
Laboratorio di Informatica (Chimica)
Laboratorio di Informatica (Chimica) HTML: Elementi Avanzati. Walter Cazzola Dipartimento di Informatica e Comunicazione Università à degli Studi di Milano. e-mail: cazzola@dico.unimi.it Walter Cazzola
DURANTE LA NAVIGAZIONE NEI SITI WEB I VISITATORI NON SOLO POSSONO CONSULTARE INFORMAZIONI STATICHE
MODULI O FORM DURANTE LA NAVIGAZIONE NEI SITI WEB I VISITATORI NON SOLO POSSONO CONSULTARE INFORMAZIONI STATICHE ADATTE ALLA LETTURA MA POSSONO SVOLGERE UN RUOLO ATTIVO NEI CONFRONTI DI UNA PAGINA WEB
HTML il linguaggio per creare le pagine per il web
HTML il linguaggio per creare le pagine per il web Parte II: elementi "complessi" HTML: frame I frame servono per suddividere il browser in parti indipendenti all interno delle quali si possono caricare
HTML il linguaggio per creare le pagine per il web
HTML il linguaggio per creare le pagine per il web Parte II: elementi "complessi" HTML: frame I frame servono per suddividere il browser in parti indipendenti all interno delle quali si possono caricare
HTML il linguaggio per creare le pagine per il web
HTML: frame HTML il linguaggio per creare le pagine per il web Parte II: elementi "complessi" I frame servono per suddividere il browser in parti indipendenti all interno delle quali si possono caricare
Dott.ssa Adriana Pietramala
Corso di Informatica Laurea Triennale - Comunicazione&Dams Dott.ssa Adriana Pietramala a.pietramala@mat.unical.it Riferimenti Sito del corso: Manuale PHP http://www.php.net/download-docs.php Editor di
I TAG - Form (moduli) (1/21)
I TAG - Form (moduli) (1/21) Scopo: Raccogliere dati dell utente, interagire con esso. L invio dei dati è solitamente organizzato in due parti: una pagina principale che contiene i vari campi dei form,
Università di Bergamo Facoltà di Ingegneria. Applicazioni Internet B. Paolo Salvaneschi B3_2 V1.22. HTML Parte B
Università di Bergamo Facoltà di Ingegneria Applicazioni Internet B Paolo Salvaneschi B3_2 V1.22 HTML Parte B Il contenuto del documento è liberamente utilizzabile dagli studenti, per studio personale
HTML il linguaggio per creare le pagine per il web
HTML il linguaggio per creare le pagine per il web Parte II: elementi "complessi" HTML: frame i frame servono per suddividere il browser in parti indipendenti all interno delle quali si possono caricare
Progettazione di siti web a.a. 2015/16
Form Progettazione di siti web a.a. 2015/16 Web form e frame Maria Simi Marzo, 2016 [Manuale di riferimento del W3C, Learning web design] HTML mette a disposizione strumenti per la raccolta di informazioni
"-//W3C//DTD XHTML 1.1//EN
XHTML 1.1 extensible HyperText Markup Language DOCTYPE All inizio di un documento xhtml bisogna specificare a quali regole ci atteniamo. Tutti i documenti che scriveremo inizieranno con 2 righe particolari:
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
HTML il linguaggio per creare le pagine per il web
HTML: frame HTML il linguaggio per creare le pagine per il web Parte II: elementi "complessi" i frame servono per suddividere il browser in parti indipendenti all interno delle quali si possono caricare
1) Il client(browser utilizzato) invia al server i dati inseriti dall utente. Server
2) Il Server richiama l'interprete PHP il quale esegue i comandi contenuti nel file.php specificato nell'attributo action del tag form creando un file HTML sulla base dei dati inviati dall utente 1) Il
Laboratorio di Basi di Dati e Web/Basi di dati e Multimedia. Docenti: Alberto Belussi e Carlo Combi Lezione 5
Laboratorio di Basi di Dati e Web/Basi di dati e Multimedia Docenti: Alberto Belussi e Carlo Combi Lezione 5 HyperText Markup Language Linguaggio di descrizione di testi secondo lo schema SGML (Standard
LEZIONE 5. Introduzione a Javascript
LEZIONE 5 Introduzione a Javascript ARCHITETTURA CLIENT SERVER Richiesta Request Indirizzo Web (URL) + dati Risposta Response HTML-CSS-Javascript WEB SERVER Un Web Server è un server che fornisce servizi
Laboratorio Progettazione Web PHP e FORMs HTML. Andrea Marchetti IIT-CNR andrea.marchetti@iit.cnr.ita 2013/2014
Laboratorio Progettazione Web PHP e FORMs HTML Andrea Marchetti IIT-CNR andrea.marchetti@iit.cnr.ita 2013/2014 Struttura Applicazioni Web Browser Web HTTP Server Web API Dati Presentation Application Storage
Internet, il web e il linguaggio HTML. percorso 3. Form
Form Se le pagine web utilizzassero il linguaggio HTML limitatamente ai soli tipi di tag visti sino a questo punto, la comunicazione tra impianto tecnologico (computer, dati, programmi ecc.) ed utente
Per la creazione di un form utilizziamo l'omonimo tag form, come nell'esempio che segue:
I Form in HTML5 L'HTML mette a disposizione una serie di interessantissimi tag il cui scopo è quello di creare moduli con tanto di caselle di testo, opzioni, bottoni di invio ed altro ancora. Il termine
Lezione 6: Form 27/04/2012
Lezione 6: Form In alcuni documenti HTML può essere utile creare dei moduli (form) che possono essere riempiti da chi consulta le pagine stesse (es. per registrarsi ad un sito). Le informazioni sono poi
Interazione con l utente : i moduli.
Interazione con l utente : i moduli. Nelle lezioni fin qui riportate, non abbiamo mai trattato l input di utente. Nelle applicazioni web, l input dell utente si acquisisce tramite i moduli (o FORM) HTML.
MODULO 1 PARTE 3. Programmazione (scripting) server-side con PHP 3.a HTTP request e HTTP response (form e link)
MODULO 1 PARTE 3 Programmazione (scripting) server-side con PHP 3.a HTTP request e HTTP response (form e link) Goy - a.a. 2009/2010 Programmazione Web 1 Gli oggetti HTTP request e HTTP response -I Vi ricordate?
Introduzione ad HTML seconda parte WWW. Fabio Vitali
Introduzione ad HTML seconda parte Fabio Vitali Introduzione Oggi esaminiamo in breve, in HTML: u Il tag HEAD u Oggetti e mappe u Form u Frame A seguire: I tag di H EAD 2/26 I tag di H EAD HEAD contiene
Esercizi su HTML5 e form
Linguaggi e tecnologie per il Web prof. Riccardo Rosati Corso di laurea in Ingegneria informatica Sapienza Università di Roma, a.a. 2016/2017 Esercizi su HTML5 e form Esercizio 1 Scrivere un documento
I Tag dell html. Parte quarta
I Tag dell html Parte quarta Le Form I moduli, o form, rendono interattive le pagine Web. Per creare un elemento modulo si usa il tag:
Alcune definizioni HTML CSS. Introduzione a HTML. November 13, HTML+CSS+Javascript
Introduzione a November 13, 2016 ++Javascript Outline 1 2 3 ++Javascript Internet vs Web Internet : rete fisica di dispositivi interconnessi. (ARPANET 1970) Web : applicativo di alto livello relativo a
LE PRIME ACTIVE SERVICE PAGE: oggetto REQUEST
LE PRIME ACTIVE SERVICE PAGE: oggetto REQUEST L'oggetto Request può essere considerato come l'esatto contrario dell'oggetto Response, infatti mentre quest'ultimo invia dati al browser, Request serve a
Array, Funzioni e interazione con l utente
Array, Funzioni e interazione con l utente Laboratorio di Progettazione Web AA 2009/2010 Chiara Renso ISTI- CNR - c.renso@isti.cnr.it Gli array sono contenitori in grado di memorizzare una sequenza di
Corso di Web Programming
Corso di Web Programming 4. HTML Parte II Paolo Milazzo Dipartimento di Informatica, Università di Pisa http://www.di.unipi.it/ milazzo milazzo di.unipi.it Corso di Laurea in Informatica Applicata A.A.
Linguaggi di Programmazione per il Web Parte 7
Linguaggi di Programmazione per il Web Parte 7 Interazione tra HTML e PHP I tag FORM e TABLE Autore Prof. Rio Chierego riochierego@libero.it 1 Siti Utili http://www.riochierego.it/mobile http://www.html.it/
Strumenti a disposizione
FORM Strumenti a disposizione L'HTML visto fino ad ora permette di descrivere solo documenti statici e passivi Colori, immagini, testi, etc... L'utente può solo interagire con i link Non sempre questo
MODULI E FORM. L'attributo enctype specifica il tipo di media utilizzato per codificare i dati del modulo, per default è di tipo MINE.
- 1 - MODULI E FORM I Moduli o Forms permettono di interagire con i visitatori del proprio sito offrendo loro la possibilità di immettere, o richiedere, informazioni tramite semplici caselle di testo,
CSS / PRIORITA E CASCADING. INFORMATICA E GRAFICA PER IL WEB HTML+CSS docente: Alessandro Gabbiadini 1
CSS / PRIORITA E CASCADING INFORMATICA E GRAFICA PER IL WEB HTML+CSS docente: Alessandro Gabbiadini 1 CSS / PRIORITA E PRECEDENZA NELLE DEFINIZIONI CSS Gli stili CSS si dicono a cascata perché lo stile
Basi di dati - Laboratorio
Basi di dati - Laboratorio Corso di Laurea in Bioinformatica Docente: Barbara Oliboni Lezione 5 Contenuto della lezione Il Linguaggio HTML (HyperText Markup Language) Struttura del documento Formattazione
Applicazioni Web: meccanismi per il passaggio di informazioni tramite HTTP Corso di Applicazioni Telematiche
Applicazioni Web: meccanismi per il passaggio di informazioni tramite HTTP Corso di Applicazioni Telematiche A.A. 2006-07 Lezione n.10 parte II Prof. Roberto Canonico Università degli Studi di Napoli Federico
Linguaggi di scripting
Linguaggi di scripting In generale uno script è un piccolo programma (al limite una sola istruzione) il cui codice viene inserito all'interno di una pagina HTML o collegato ad esso, e interpretato dal
ESEMPI DI FORM (da www.html.it)
ESEMPI DI FORM (da www.html.it) Vediamo, nel particolare, tutti i tag che HTML 4.0 prevede per la creazione di form. Questo tag apre e chiude il modulo e raccoglie il contenuto dello stesso,
Array, Funzioni e interazione con l utente
Array, Funzioni e interazione con l utente Laboratorio di Progettazione Web AA 2010/2011 Claudio Lucchese / Chiara Renso ISTI- CNR claudio.lucchese@isti.cnr.it Gli array sono contenitori in grado di memorizzare
Metodologie Informatiche Applicate al Turismo
Metodologie Informatiche Applicate al Turismo 7. HTML Parte III (Aspetti avanzati) Paolo Milazzo Dipartimento di Informatica, Università di Pisa http://www.di.unipi.it/ milazzo milazzo di.unipi.it Corso
Laboratorio di Basi di Dati/Basi di dati per Bioinformatica. Docenti: Alberto Belussi e Carlo Combi (lucidi a cura di Alberto Belussi) Lezione 5
Laboratorio di Basi di Dati/Basi di dati per Bioinformatica Docenti: Alberto Belussi e Carlo Combi (lucidi a cura di Alberto Belussi) Lezione 5 HyperText Markup Language! Linguaggio di descrizione di testi
OBIETTIVI MINIMI Anno scolastico TIC-TIT. 1. Foglio elettronico: funzioni fondamentali (Excel)
ISTITUTO TECNICO COMMERCIALE STATALE SCHIAPARELLI-GRAMSCI CLASSI CORSI OBIETTIVI MINIMI Anno scolastico 2010-2011 TIC-TIT OBIETTIVI 1. Foglio elettronico: funzioni fondamentali (Excel) CONTENUTI / tipologia
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
PHP & MySQL. Giselda De Vita
PHP & MySQL Giselda De Vita - 2014 1 Per creare un applicazione WEB su APACHE, in linguaggio PHP, con Base Dati MySQL, possiamo lavorare in locale o in rete. Per lavorare in locale abbiamo bisogno di installare
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
Laboratorio di Basi di Dati Web/MM
Laboratorio di Basi di Dati Web/MM Docente: Alberto Belussi Lezione 5 HyperText Markup Language Linguaggio di descrizione di testi secondo lo schema SGML (Standard Generalized Markup Language) Gli ipertesti
HTML FORM E PHP. Programmazione Web 1
HTML FORM E PHP Programmazione Web 1 Form Un insieme di elemen5 in una pagina web con cui l'utente interagisce per inviare informazioni ad uno script Realizzazione di due cose la pagina contente il form
ELEMENTI INTERATTIVI
ELEMENTI INTERATTIVI A Il tag definisce un collegamento ipertestuale, che viene utilizzato per collegare una risorsa internet. L'attributo più importante dell'elemento è l'attributo href, che indica
HTML HTML. HyperText Markup Language. Struttura di un documento. Gli elementi essenziali di un documento HTML sono i seguenti TAG: <HTML>...
HTML HyperText Markup Language Struttura di un documento HTML Gli elementi essenziali di un documento HTML sono i seguenti TAG: ... ... ... Struttura di un documento
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.
Basi di Dati-IX. Basi di dati e web. Introduzione. Schema. Basi di dati e web. Corso di Laurea in Informatica Anno Accademico 2013/2014
Schema 2 Basi di Dati-IX Corso di Laurea in Informatica Anno Accademico 2013/2014 Paolo Baldan baldan@math.unipd.it http://www.math.unipd.it/~baldan Basi di dati e web: nozioni generali Basi del linguaggio
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
Introduzione all HTML, parte quarta
Introduzione all HTML, parte quarta Università di Pisa pievatolo@dsp.unipi.it 31 marzo 2014 Sommario 1 Head: che cosa ti sei messo in testa? 2 Nav 3 Head Attributo lang Per esempio: Indica
NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP ) E N G I N E = I
Esempio base: tabella amici Creare un sistema informatico che permetta di memorizzare il cognome, nome e data di nascita degli amici. Quindi creare una tabella per memorizzare i valori richiesti. Si chiede
Tecnologie di Sviluppo per il Web
Tecnologie di Sviluppo per il Web JavaScript Introduzione versione 2.1 Questo lavoro è concesso in uso secondo i termini di una licenza Creative Commons (vedi ultima pagina) G. Mecca Università della Basilicata
WWW (World Wide Web)!& ( # %% (*0 #,% )0#1( &#"#2
! "#$" %% $"$&&"'& $%%& $'&( ) *+&, ) && *+ ( -./ WWW (World Wide Web)!& ( # (&%#(!(&&( %% (*0 #,% )0#1( &#"#2 Siti Web pagine Web: documenti pronti per essere registrati su un server Internet residenza
Laboratorio di Progettazione Web Applicazioni Web
Laboratorio di Progettazione Web Applicazioni Web AA 2010/2011 Claudio Lucchese ISTI - CNR claudio.lucchese@isti.cnr.it Per sviluppare una applicazione web occorre aggiungere potere di calcolo e memorizzazione
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:
Corso PHP: Strutturare un sito, GET, Form HTML, POST
Corso PHP: Strutturare un sito, GET, Form HTML, POST Copyright (c) 2011 Antonio Gallo (antoniog.web@gmail.com) Il seguente documento è rilasciato sotto licenza Creative Commons 2.5 Attribution Share alike.
Linguaggi e tecnologie per il Web 2016/2017 Facsimile di un compito d esame
Esercizio 1 Linguaggi e tecnologie per il Web 2016/2017 Facsimile di un compito d esame (a) Scrivere un documento HTML contenente una form contenente i seguenti campi: cognome e nome (casella di testo
Esercizi su JavaScript, DOM e Web Storage
Linguaggi e tecnologie per il Web prof. Riccardo Rosati Corso di laurea in Ingegneria informatica e automatica Sapienza Università di Roma, a.a. 2017/2018 Esercizi su JavaScript, DOM e Web Storage Esercizio
I FORM. L'attributo action contiene l'url del file php a cui devono essere inviati i file per essere elaborati.
I FORM Che cosa sono e che caratteristiche hanno Un form contiene molti oggetti che permettono di inserire dati usando la tastiera. Tali dati verranno poi inviati alla pagina php che avrà il compito di
Il linguaggio HTML - Parte 3
Corso IFTS Informatica, Modulo 3 Progettazione pagine web statiche (50 ore) Il linguaggio HTML - Parte 3 Dott. Chiara Braghin braghin@dti.unimi.it Addenda Vedi tabella caratteri speciali Vedi file caratteri_speciali.html
Sicurezza Protezioni in una pagina Web
Pagina 1 di 7 Sicurezza Protezioni in una pagina Web HTML è un linguaggio che consente di presentare informazioni in pagine di formato predefinito e accattivante. Quando non si hanno a disposizione informazioni
Agent and Object Technology Lab Dipartimento di Ingegneria dell Informazione Università degli Studi di Parma. Fondamenti di Informatica
Agent and Object Technology Lab Dipartimento di Ingegneria dell Informazione Università degli Studi di Parma Fondamenti di Informatica Applicazioni web Michele Tomaiuolo Sommario Form e campi di input
Programmazione web. Lezione del 2 Marzo 2018
Programmazione web Lezione del 2 Marzo 2018 Prof.ssa Novella Bartolini Ricevimento: Mercoledì ore 12:30-13:30 (prendere appuntamento per email) Via Salaria 113, terzo piano, stanza 309 Email: bartolini@di.uniroma1.it
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