SlideShare ist ein Scribd-Unternehmen logo

HTML - Primi Passi

•
•
Andrea Riezzo
Andrea Riezzo

Primi passi con HTML e la struttura di una pagina web generica. Lezione svolta nel corso del 5° A.T.A. dell'I.I.S.S. "De Pace" di Lecce. http://androe.com

Technologie
1 von 117
HTML
UTENTE connesso con un computer uno smartphone un tablet
UTENTE INTERNET connesso con la Rete un computer uno smartphone un tablet
UTENTE INTERNET SERVER dove risiede connesso con la Rete il sito web richiesto un computer uno smartphone un tablet
INDIRIZZO WEB http://google.it UTENTE INTERNET SERVER dove risiede connesso con la Rete il sito web richiesto un computer uno smartphone un tablet
INDIRIZZO WEB http://google.it UTENTE INTERNET SERVER dove risiede connesso con la Rete il sito web richiesto un computer uno smartphone un tablet
INDIRIZZO WEB http://google.it DOCUMENTO HTML (pagina web) UTENTE INTERNET SERVER dove risiede connesso con la Rete il sito web richiesto un computer uno smartphone un tablet
INDIRIZZO WEB http://google.it DOCUMENTO HTML (pagina web) UTENTE INTERNET SERVER dove risiede connesso con la Rete il sito web richiesto un computer uno smartphone un tablet
INDIRIZZO WEB http://google.it DOCUMENTO HTML (pagina web) UTENTE INTERNET SERVER dove risiede connesso con la Rete il sito web richiesto un computer uno smartphone un tablet
HTML
ELEMENTI di una pagina web
pagina web senza CSS
HEADER (testata)
HEADER (testata) MENU di navigazione
HEADER (testata) MENU di navigazione CONTENUTO
HEADER (testata) MENU di navigazione CONTENUTO COLONNA LATERALE suddivisa in “blocchi”
HEADER (testata) MENU di navigazione CONTENUTO COLONNA LATERALE suddivisa in “blocchi” FOOTER (pié di pagina)
HEADER (testata) MENU di navigazione CONTENUTO COLONNA LATERALE suddivisa in “blocchi” FOOTER (pié di pagina) BODY
HTML
<html> </html>
<html> <head> </head> <body> </body> </html>
<html> <head> <title>La Musica</title> </head> <body> </body> </html>
<html> <head> <title>La Musica</title> </head> <body> </body> </html>
<html> <head> <title>La Musica</title> </head> <body> ... UN SACCO DI ROBA !!! ... </body> </html>
<body> </body>
<body> </body>
<div>
<div> l’elemento <div> definisce una sezione della pagina HTML
<div> l’elemento <div> definisce una sezione della pagina HTML
<body> <div> </div> </body>
<body> <div id=”contenitore”> </div> </body>
id
id l’attributo id specifica un “nome” unico per un elemento HTML
<body> <div id=”contenitore”> </div> </body>
<body> <div id=”contenitore”> </div> </body>
<body> <div id=”contenitore”> </div> </body>
<body> <div id=”contenitore”> <div id=”header”> </div> </div> </body>
<body> <div id=”contenitore”> <div id=”header”> <h1> </h1> </div> </div> </body>
<body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> </div> </body>
<h1> l’elemento <h1> indica il titolo più importante del documento HTML
<h1> <h2> <h3> <h4> <h5> <h6> i titoli in un documento HTML
<body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> </div> </body>
<body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> </div> </div> </body>
<body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> </div> </div> </body>
<body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> </ul> </div> </div> </body>
<ul> l’elemento <ul> indica un elenco puntato all’interno del documento HTML
<li> l’elemento <li> indica un elemento dell’elenco <ul> all’interno del documento HTML
<ul> <li>Elemento 1</li> <li>Elemento 2</li> <li>Elemento 3</li> </ul> esempio del codice
Elemento 1 Elemento 2 Elemento 3 come lo vedremo sul browser
<body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> </ul> </div> </div> </body>
<body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> </li> </ul> </div> </div> </body>
<body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> Home </li> </ul> </div> </div> </body>
<body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> Home </li> <li> </li> </ul> </div> </div> </body>
<body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> Home </li> <li> Chi Siamo </li> </ul> </div> </div> </body>
<body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> Home </li> <li> Chi Siamo </li> <li> </li> </ul> </div> </div> </body>
<body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> Home </li> <li> Chi Siamo </li> <li> Foto </li> </ul> </div> </div> </body>
<body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> Home </li> <li> Chi Siamo </li> <li> Foto </li> <li> Video </li> </ul> </div> </div> </body>
<body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> Home </li> <li> Chi Siamo </li> <li> Foto </li> <li> Video </li> </ul> </div> </div> </body>
<body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> Home </li> <li> Chi Siamo </li> <li> Foto </li> <li> Video </li> </ul> </div> </div> </body>
<body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> Home </li> <li> Chi Siamo </li> <li> Foto </li> <li> Video </li> </ul> </div> </div> </body>
<body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> Home </li> <li> Chi Siamo </li> <li> Foto </li> <li> Video </li> </ul> </div> </div> </body>
<body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> Home </li> <li> Chi Siamo </li> <li> Foto </li> <li> Video </li> </ul> </div> </div> </body>
<body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> Home </li> <li> Chi Siamo </li> <li> Foto </li> <li> Video </li> </ul> </div> <div id=”contenuto”> </div> </div> </body>
<body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> Home </li> <li> Chi Siamo </li> <li> Foto </li> <li> Video </li> </ul> </div> <div id=”contenuto”> </div> </div> </body>
<body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> Home </li> <li> Chi Siamo </li> <li> Foto </li> <li> Video </li> </ul> </div> <div id=”contenuto”> </div> </div> </body>
<body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> Home </li> <li> Chi Siamo </li> <li> Foto </li> <li> Video </li> </ul> </div> <div id=”contenuto”> </div> </div> </body>
<div id=”contenuto”> </div>
<div id=”contenuto”> <h1> </h1> </div>
<div id=”contenuto”> <h1> La Musica: le origini </h1> </div>
<div id=”contenuto”> <h1> La Musica: le origini </h1> <p> </p> </div>
<div id=”contenuto”> <h1> La Musica: le origini </h1> <p> </p> </div>
<div id=”contenuto”> <h1> La Musica: le origini </h1> <p> <img src=”speaker.jpg” width=”400” height=”300” alt=”cassa” /> </p> </div>
<div id=”contenuto”> <h1> La Musica: le origini </h1> <p> <img src=”speaker.jpg” width=”400” height=”300” alt=”cassa” /> </p> </div>
<img> l’elemento <img> indica un’immagine all’interno del documento HTML con l’aiuto degli attributi src, width, height e alt
src definisce il percorso del file width definisce la larghezza dell’immagine height definisce l’altezza dell’immagine alt definisce il testo alternativo all’immagine
<img>
<img >
<img src=”immagine.jpg” >
<img src=”immagine.jpg” >
<img src=”immagine.jpg” width=”400” height=”300” >
<img src=”immagine.jpg” width=”400” height=”300” >
<img src=”immagine.jpg” width=”400” height=”300” >
<img src=”immagine.jpg” width=”400” height=”300” alt=”Immagine a caso” >
<img src=”immagine.jpg” width=”400” height=”300” alt=”Immagine a caso” />
<div id=”contenuto”> <h1> La Musica: le origini </h1> <p> <img src=”speaker.jpg” width=”400” height=”300” alt=”cassa” /> </p> <p> </p> </div>
<div id=”contenuto”> <h1> La Musica: le origini </h1> <p> <img src=”speaker.jpg” width=”400” height=”300” alt=”cassa” /> </p> <p> </p> </div>
<div id=”contenuto”> <h1> La Musica: le origini </h1> <p> <img src=”speaker.jpg” width=”400” height=”300” alt=”cassa” /> </p> <p> La musica è l'arte e la scienza dell'organizzazione dei suoni nel corso del tempo. Si tratta di arte in quanto complesso di norme pratiche adatte a conseguire determinati gradevoli effetti sonori, che riescono ad esprimere l'interiorità dell'individuo, si tratta di scienza in quanto studio della nascita, dell'evoluzione e dell'analisi dell'intima struttura della musica. </p> </div>
<div id=”contenuto”> <h1> La Musica: le origini </h1> <p> <img src=”speaker.jpg” width=”400” height=”300” alt=”cassa” /> </p> <p> La musica è l'arte e la scienza dell'organizzazione dei suoni nel corso del tempo. Si tratta di arte in quanto complesso di norme pratiche adatte a conseguire determinati gradevoli effetti sonori, che riescono ad esprimere l'interiorità dell'individuo, si tratta di scienza in quanto studio della nascita, dell'evoluzione e dell'analisi dell'intima struttura della musica. </p> </div>
<div id=”contenuto”> <h1> La Musica: le origini </h1> <p> <img src=”speaker.jpg” width=”400” height=”300” alt=”cassa” /> </p> <p> La musica è l'arte e la scienza dell'organizzazione dei suoni nel corso del tempo. Si tratta di arte in quanto complesso di norme pratiche adatte a conseguire determinati gradevoli effetti sonori, che riescono ad esprimere l'interiorità dell'individuo, si tratta di scienza in quanto studio della nascita, dell'evoluzione e dell'analisi dell'intima struttura della musica. </p> <p>Il generare suoni avviene mediante il canto o mediante strumenti musicali che, attraverso i principi dell'acustica, provocano la percezione uditiva e l'esperienza emotiva voluta dall'artista. </p> </div>
<div id=”contenuto”> <h1> La Musica: le origini </h1> <p> <img src=”speaker.jpg” width=”400” height=”300” alt=”cassa” /> </p> <p> La musica è l'arte e la scienza dell'organizzazione dei suoni nel corso del tempo. Si tratta di arte in quanto complesso di norme pratiche adatte a conseguire determinati gradevoli effetti sonori, che riescono ad esprimere l'interiorità dell'individuo, si tratta di scienza in quanto studio della nascita, dell'evoluzione e dell'analisi dell'intima struttura della musica. </p> <p>Il generare suoni avviene mediante il canto o mediante strumenti musicali che, attraverso i principi dell'acustica, provocano la percezione uditiva e l'esperienza emotiva voluta dall'artista. </p> <p>Il significato del termine musica non è comunque univoco ed è molto dibattuto tra gli studiosi per via delle diverse accezioni utilizzate nei vari periodi storici. </p> </div>
<div id=”contenuto”> <h1> La Musica: le origini </h1> <p> <img src=”speaker.jpg” width=”400” height=”300” alt=”cassa” /> </p> <p> La musica è l'arte e la scienza dell'organizzazione dei suoni nel corso del tempo. <strong>Si tratta di arte</strong> in quanto complesso di norme pratiche adatte a conseguire determinati gradevoli effetti sonori, che riescono ad esprimere l'interiorità dell'individuo, si tratta di scienza in quanto studio della nascita, dell'evoluzione e dell'analisi dell'intima struttura della musica.</p> <p>Il generare suoni avviene mediante il canto o mediante strumenti musicali che, attraverso i principi dell'acustica, provocano la percezione uditiva e l'esperienza emotiva voluta dall'artista. </p> <p>Il significato del termine musica non è comunque univoco ed è molto dibattuto tra gli studiosi per via delle diverse accezioni utilizzate nei vari periodi storici. </p> </div>
<strong> il tag <strong> indica il grassetto di un testo all’interno del documento HTML
<div id=”contenuto”> <h1> La Musica: le origini </h1> <p> <img src=”speaker.jpg” width=”400” height=”300” alt=”cassa” /> </p> <p> La musica è l'arte e la scienza dell'organizzazione dei suoni nel corso del tempo. <strong>Si tratta di arte</strong> in quanto complesso di norme pratiche adatte a conseguire determinati gradevoli effetti sonori, che riescono ad esprimere l'interiorità dell'individuo, si tratta di scienza in quanto studio della nascita, dell'evoluzione e dell'analisi dell'intima struttura della musica.</p> <p>Il <em>generare suoni</em> avviene mediante il canto o mediante strumenti musicali che, attraverso i principi dell'acustica, provocano la percezione uditiva e l'esperienza emotiva voluta dall'artista. </p> <p>Il significato del termine musica non è comunque univoco ed è molto dibattuto tra gli studiosi per via delle diverse accezioni utilizzate nei vari periodi storici. </p> </div>
<em> il tag <em> indica il corsivo di un testo all’interno del documento HTML
<div id=”contenuto”> <h1> La Musica: le origini </h1> <p> <img src=”speaker.jpg” width=”400” height=”300” alt=”cassa” /> </p> <p> La musica è l'arte e la scienza dell'organizzazione dei suoni nel corso del tempo. <strong>Si tratta di arte</strong> in quanto complesso di norme pratiche adatte a conseguire determinati gradevoli effetti sonori, che riescono ad esprimere l'interiorità dell'individuo, si tratta di scienza in quanto studio della nascita, dell'evoluzione e dell'analisi dell'intima struttura della musica.</p> <p>Il <em>generare suoni</em> avviene mediante il canto o mediante strumenti musicali che, attraverso i principi dell'acustica, provocano la percezione uditiva e l'esperienza emotiva voluta dall'artista. </p> <p>Il significato del termine musica non è comunque univoco ed è molto dibattuto tra gli studiosi per via delle diverse accezioni utilizzate nei vari periodi storici. </p> </div>
<div id=”contenuto”> <h1> La Musica: le origini </h1> <p> <img src=”speaker.jpg” width=”400” height=”300” alt=”cassa” /> </p> <p> La musica è l'arte e la scienza dell'organizzazione dei suoni nel corso del tempo. <strong>Si tratta di arte</strong> in quanto complesso di norme pratiche adatte a conseguire determinati gradevoli effetti sonori, che riescono ad esprimere l'interiorità dell'individuo, si tratta di scienza in quanto studio della nascita, dell'evoluzione e dell'analisi dell'intima struttura della musica.</p> <p>Il <em>generare suoni</em> avviene mediante il canto o mediante strumenti musicali che, attraverso i principi dell'acustica, provocano la percezione uditiva e l'esperienza emotiva voluta dall'artista. </p> <p>Il significato del termine <a href=”http://www.google.it”>musica</a> non è comunque univoco ed è molto dibattuto tra gli studiosi per via delle diverse accezioni utilizzate nei vari periodi storici.</p> </div>
<a> il tag <a> indica un collegamento all’interno del documento HTML con l’aiuto dell’attributo href che ne definisce la “destinazione”
<a href=”http://www.google.it”>testo del link</a>
COSA NON FARE
COSA NON FARE
COSA NON FARE 1. dimenticare di chiudere i tag HTML
<p>Il significato del termine musica è <strong>dibattuto tra gli studiosi per via delle diverse accezioni utilizzate nei vari periodi storici.</p>
<p>Il significato del termine musica è <strong>dibattuto tra gli studiosi per via delle diverse accezioni utilizzate nei vari periodi storici.</p> NO
<p>Il significato del termine musica è <strong>dibattuto<strong> tra gli studiosi per via delle diverse accezioni utilizzate nei vari periodi storici.</p> NO
<p>Il significato del termine musica è <strong>dibattuto</strong> tra gli studiosi per via delle diverse accezioni utilizzate nei vari periodi storici.</p> SÌ
COSA NON FARE 1. dimenticare di chiudere i tag HTML
COSA NON FARE 1. dimenticare di chiudere i tag HTML 2. chiudere i tag HTML con ordine
<p><strong>Il generare suoni avviene mediante il canto o mediante strumenti musicali </p> </strong> NO
<p><strong>Il generare suoni avviene mediante il canto o mediante strumenti musicali</strong> </p> SÌ
COSA NON FARE 1. dimenticare di chiudere i tag HTML 2. chiudere i tag HTML con ordine
COSA NON FARE 1. dimenticare di chiudere i tag HTML 2. chiudere i tag HTML con ordine 3. racchiudere un tag <div>, <h1>, <h2>, <p> (ecc) da un <a> per creare un link
<a> <h2> La Musica: le origini</h2> </a> <a> <p>Il significato del termine musica è dibattuto tra gli studiosi per via delle diverse accezioni utilizzate nei vari periodi storici. </p> </a> NO
<a> <h2> La Musica: le origini</h2> <p>Il significato del termine musica è dibattuto tra gli studiosi per via delle diverse accezioni utilizzate nei vari periodi storici. </p> </a> NO
<h2> <a> La Musica: le origini </a> </h2> <p><a>Il significato del termine musica è dibattuto tra gli studiosi per via delle diverse accezioni utilizzate nei vari periodi storici. </a> </p> SÌ
androe.com

Empfohlen

Grafica per il Web - Web Design Marketing Grafica Vettoriale
Grafica per il Web - Web Design Marketing Grafica VettorialeGrafica per il Web - Web Design Marketing Grafica Vettoriale
Grafica per il Web - Web Design Marketing Grafica VettorialeMassimiliano Camillucci
 
HTML + CSS - Lezione 1
HTML + CSS - Lezione 1HTML + CSS - Lezione 1
HTML + CSS - Lezione 1Vincenzo Caico
 
CSS Font & Text style
CSS Font & Text style CSS Font & Text style
CSS Font & Text style Yaowaluck Promdee
 
Html introduction
Html introductionHtml introduction
Html introductionDalia Elbadry
 
Style and Selector
Style and SelectorStyle and Selector
Style and SelectorYaowaluck Promdee
 
Introduction to Javascript
Introduction to JavascriptIntroduction to Javascript
Introduction to JavascriptSeble Nigussie
 
Basic HTML
Basic HTMLBasic HTML
Basic HTMLSayan De
 
Html5 and-css3-overview
Html5 and-css3-overviewHtml5 and-css3-overview
Html5 and-css3-overviewJacob Nelson
 

Empfohlen

Grafica per il Web - Web Design Marketing Grafica Vettoriale
Grafica per il Web - Web Design Marketing Grafica VettorialeGrafica per il Web - Web Design Marketing Grafica Vettoriale
Grafica per il Web - Web Design Marketing Grafica VettorialeMassimiliano Camillucci
 
HTML + CSS - Lezione 1
HTML + CSS - Lezione 1HTML + CSS - Lezione 1
HTML + CSS - Lezione 1Vincenzo Caico
 
CSS Font & Text style
CSS Font & Text style CSS Font & Text style
CSS Font & Text style Yaowaluck Promdee
 
Html introduction
Html introductionHtml introduction
Html introductionDalia Elbadry
 
Style and Selector
Style and SelectorStyle and Selector
Style and SelectorYaowaluck Promdee
 
Introduction to Javascript
Introduction to JavascriptIntroduction to Javascript
Introduction to JavascriptSeble Nigussie
 
Basic HTML
Basic HTMLBasic HTML
Basic HTMLSayan De
 
Html5 and-css3-overview
Html5 and-css3-overviewHtml5 and-css3-overview
Html5 and-css3-overviewJacob Nelson
 
Lab#5 style and selector
Lab#5 style and selectorLab#5 style and selector
Lab#5 style and selectorYaowaluck Promdee
 
Presentación Powerpoint HTML
Presentación Powerpoint HTMLPresentación Powerpoint HTML
Presentación Powerpoint HTMLLola1234__
 
Html base - classi prime - multimedia
Html base - classi prime - multimediaHtml base - classi prime - multimedia
Html base - classi prime - multimediaMatteo Ziviani
 
Images and Tables in HTML
Images and Tables in HTMLImages and Tables in HTML
Images and Tables in HTMLAarti P
 
Lab#13 responsive web
Lab#13 responsive webLab#13 responsive web
Lab#13 responsive webYaowaluck Promdee
 
Html tags or elements
Html tags or elementsHtml tags or elements
Html tags or elementsWebtech Learning
 
CSS.ppt
CSS.pptCSS.ppt
CSS.pptMukulSingh293955
 
2. html attributes
2. html attributes2. html attributes
2. html attributesMuhammad Toqeer
 
HTML e CSS
HTML e CSSHTML e CSS
HTML e CSSManuel Scapolan
 
Navigation and Link
Navigation and LinkNavigation and Link
Navigation and LinkYaowaluck Promdee
 
Introduction to HTML
Introduction to HTMLIntroduction to HTML
Introduction to HTMLAjay Khatri
 
Introduction to html
Introduction to htmlIntroduction to html
Introduction to htmlveena parihar
 
HTML Introduction
HTML IntroductionHTML Introduction
HTML Introductionc525600
 
HTML Basics by software development company india
HTML Basics by software development company indiaHTML Basics by software development company india
HTML Basics by software development company indiaiFour Institute - Sustainable Learning
 
Html 5-tables-forms-frames (1)
Html 5-tables-forms-frames (1)Html 5-tables-forms-frames (1)
Html 5-tables-forms-frames (1)club23
 
HTML, CSS And JAVASCRIPT!
HTML, CSS And JAVASCRIPT!HTML, CSS And JAVASCRIPT!
HTML, CSS And JAVASCRIPT!Syahmi RH
 
Intro to HTML & CSS
Intro to HTML & CSSIntro to HTML & CSS
Intro to HTML & CSSSyed Sami
 
Introduction to CSS3
Introduction to CSS3Introduction to CSS3
Introduction to CSS3Seble Nigussie
 
HTML Dasar : #5 Heading
HTML Dasar : #5 HeadingHTML Dasar : #5 Heading
HTML Dasar : #5 HeadingSandhika Galih
 
Intro to HTML and CSS basics
Intro to HTML and CSS basicsIntro to HTML and CSS basics
Intro to HTML and CSS basicsEliran Eliassy
 
HTMLslide html
HTMLslide htmlHTMLslide html
HTMLslide htmlritalerede
 
CSS corso base (classi seconde, mod 1)
CSS corso base (classi seconde, mod 1)CSS corso base (classi seconde, mod 1)
CSS corso base (classi seconde, mod 1)Matteo Ziviani
 

Weitere ähnliche Inhalte

Was ist angesagt?

Presentación Powerpoint HTML
Presentación Powerpoint HTMLPresentación Powerpoint HTML
Presentación Powerpoint HTMLLola1234__
 
Html base - classi prime - multimedia
Html base - classi prime - multimediaHtml base - classi prime - multimedia
Html base - classi prime - multimediaMatteo Ziviani
 
Images and Tables in HTML
Images and Tables in HTMLImages and Tables in HTML
Images and Tables in HTMLAarti P
 
Introduction to HTML
Introduction to HTMLIntroduction to HTML
Introduction to HTMLAjay Khatri
 
Introduction to html
Introduction to htmlIntroduction to html
Introduction to htmlveena parihar
 
HTML Introduction
HTML IntroductionHTML Introduction
HTML Introductionc525600
 
Html 5-tables-forms-frames (1)
Html 5-tables-forms-frames (1)Html 5-tables-forms-frames (1)
Html 5-tables-forms-frames (1)club23
 
HTML, CSS And JAVASCRIPT!
HTML, CSS And JAVASCRIPT!HTML, CSS And JAVASCRIPT!
HTML, CSS And JAVASCRIPT!Syahmi RH
 
Intro to HTML & CSS
Intro to HTML & CSSIntro to HTML & CSS
Intro to HTML & CSSSyed Sami
 
HTML Dasar : #5 Heading
HTML Dasar : #5 HeadingHTML Dasar : #5 Heading
HTML Dasar : #5 HeadingSandhika Galih
 
Intro to HTML and CSS basics
Intro to HTML and CSS basicsIntro to HTML and CSS basics
Intro to HTML and CSS basicsEliran Eliassy
 

Was ist angesagt? (20)

Lab#5 style and selector
Lab#5 style and selectorLab#5 style and selector
Lab#5 style and selector
 
Presentación Powerpoint HTML
Presentación Powerpoint HTMLPresentación Powerpoint HTML
Presentación Powerpoint HTML
 
Html base - classi prime - multimedia
Html base - classi prime - multimediaHtml base - classi prime - multimedia
Html base - classi prime - multimedia
 
Images and Tables in HTML
Images and Tables in HTMLImages and Tables in HTML
Images and Tables in HTML
 
Lab#13 responsive web
Lab#13 responsive webLab#13 responsive web
Lab#13 responsive web
 
Html tags or elements
Html tags or elementsHtml tags or elements
Html tags or elements
 
CSS.ppt
CSS.pptCSS.ppt
CSS.ppt
 
2. html attributes
2. html attributes2. html attributes
2. html attributes
 
HTML e CSS
HTML e CSSHTML e CSS
HTML e CSS
 
Navigation and Link
Navigation and LinkNavigation and Link
Navigation and Link
 
Introduction to HTML
Introduction to HTMLIntroduction to HTML
Introduction to HTML
 
Introduction to html
Introduction to htmlIntroduction to html
Introduction to html
 
HTML Introduction
HTML IntroductionHTML Introduction
HTML Introduction
 
HTML Basics by software development company india
HTML Basics by software development company indiaHTML Basics by software development company india
HTML Basics by software development company india
 
Html 5-tables-forms-frames (1)
Html 5-tables-forms-frames (1)Html 5-tables-forms-frames (1)
Html 5-tables-forms-frames (1)
 
HTML, CSS And JAVASCRIPT!
HTML, CSS And JAVASCRIPT!HTML, CSS And JAVASCRIPT!
HTML, CSS And JAVASCRIPT!
 
Intro to HTML & CSS
Intro to HTML & CSSIntro to HTML & CSS
Intro to HTML & CSS
 
Introduction to CSS3
Introduction to CSS3Introduction to CSS3
Introduction to CSS3
 
HTML Dasar : #5 Heading
HTML Dasar : #5 HeadingHTML Dasar : #5 Heading
HTML Dasar : #5 Heading
 
Intro to HTML and CSS basics
Intro to HTML and CSS basicsIntro to HTML and CSS basics
Intro to HTML and CSS basics
 

Andere mochten auch

HTMLslide html
HTMLslide htmlHTMLslide html
HTMLslide htmlritalerede
 
CSS corso base (classi seconde, mod 1)
CSS corso base (classi seconde, mod 1)CSS corso base (classi seconde, mod 1)
CSS corso base (classi seconde, mod 1)Matteo Ziviani
 
Introduzione ai Sistemi Operativi
Introduzione ai Sistemi OperativiIntroduzione ai Sistemi Operativi
Introduzione ai Sistemi OperativiorestJump
 
Struttura di una pagina html
Struttura di una pagina htmlStruttura di una pagina html
Struttura di una pagina htmlEnrico Mainero
 
Html e CSS ipertesti e siti web 4.5
Html e CSS ipertesti e siti web 4.5Html e CSS ipertesti e siti web 4.5
Html e CSS ipertesti e siti web 4.5orestJump
 

Andere mochten auch (7)

HTMLslide html
HTMLslide htmlHTMLslide html
HTMLslide html
 
CSS corso base (classi seconde, mod 1)
CSS corso base (classi seconde, mod 1)CSS corso base (classi seconde, mod 1)
CSS corso base (classi seconde, mod 1)
 
Introduzione ai Sistemi Operativi
Introduzione ai Sistemi OperativiIntroduzione ai Sistemi Operativi
Introduzione ai Sistemi Operativi
 
Corso di HTML5 e CSS
Corso di HTML5 e CSSCorso di HTML5 e CSS
Corso di HTML5 e CSS
 
Struttura di una pagina html
Struttura di una pagina htmlStruttura di una pagina html
Struttura di una pagina html
 
Html
HtmlHtml
Html
 
Html e CSS ipertesti e siti web 4.5
Html e CSS ipertesti e siti web 4.5Html e CSS ipertesti e siti web 4.5
Html e CSS ipertesti e siti web 4.5
 

Ähnlich wie HTML - Primi Passi

HTML non per web designer
HTML non per web designerHTML non per web designer
HTML non per web designerAndrea Rigon
 
Ancora anatomia, le pagine HTML(5)
Ancora anatomia, le pagine HTML(5)Ancora anatomia, le pagine HTML(5)
Ancora anatomia, le pagine HTML(5)nois3lab
 
Primo approccio al design adattivo
Primo approccio al design adattivoPrimo approccio al design adattivo
Primo approccio al design adattivoSalvatore Paone
 

Ähnlich wie HTML - Primi Passi (6)

Html5 - Un anno dopo
Html5 - Un anno dopoHtml5 - Un anno dopo
Html5 - Un anno dopo
 
HTML non per web designer
HTML non per web designerHTML non per web designer
HTML non per web designer
 
CSS - Primi Passi
CSS - Primi PassiCSS - Primi Passi
CSS - Primi Passi
 
Seo html russo
Seo html russoSeo html russo
Seo html russo
 
Ancora anatomia, le pagine HTML(5)
Ancora anatomia, le pagine HTML(5)Ancora anatomia, le pagine HTML(5)
Ancora anatomia, le pagine HTML(5)
 
Primo approccio al design adattivo
Primo approccio al design adattivoPrimo approccio al design adattivo
Primo approccio al design adattivo
 

Mehr von Andrea Riezzo

12 cose da non fare sui social media
12 cose da non fare sui social media12 cose da non fare sui social media
12 cose da non fare sui social mediaAndrea Riezzo
 
Creatività, Condivisione e Lavoro Creativo
Creatività, Condivisione e Lavoro CreativoCreatività, Condivisione e Lavoro Creativo
Creatività, Condivisione e Lavoro CreativoAndrea Riezzo
 
Basi di Fotografia e Light-Painting
Basi di Fotografia e Light-PaintingBasi di Fotografia e Light-Painting
Basi di Fotografia e Light-PaintingAndrea Riezzo
 
Light-Painting ITA - Introduzione
Light-Painting ITA - IntroduzioneLight-Painting ITA - Introduzione
Light-Painting ITA - IntroduzioneAndrea Riezzo
 
Briefing su Branding, Colore e Fonts
Briefing su Branding, Colore e FontsBriefing su Branding, Colore e Fonts
Briefing su Branding, Colore e FontsAndrea Riezzo
 
Logo & Font in un Brand
Logo & Font in un BrandLogo & Font in un Brand
Logo & Font in un BrandAndrea Riezzo
 
Branding e Psicologia del Colore
Branding e Psicologia del ColoreBranding e Psicologia del Colore
Branding e Psicologia del ColoreAndrea Riezzo
 
(Breve) Storia del Web Design
(Breve) Storia del Web Design(Breve) Storia del Web Design
(Breve) Storia del Web DesignAndrea Riezzo
 
Cosa è successo in soli 6 mesi sul Web
Cosa è successo in soli 6 mesi sul WebCosa è successo in soli 6 mesi sul Web
Cosa è successo in soli 6 mesi sul WebAndrea Riezzo
 
Web Marketing (anche nei social media) spicciolo
Web Marketing (anche nei social media) spiccioloWeb Marketing (anche nei social media) spicciolo
Web Marketing (anche nei social media) spiccioloAndrea Riezzo
 
Il diritto d'autore sul Web
Il diritto d'autore sul WebIl diritto d'autore sul Web
Il diritto d'autore sul WebAndrea Riezzo
 
Breve storia del Web Publishing - editoria sul Web
Breve storia del Web Publishing - editoria sul WebBreve storia del Web Publishing - editoria sul Web
Breve storia del Web Publishing - editoria sul WebAndrea Riezzo
 
La Web-Tv: una breve storia dei video sul Web
La Web-Tv: una breve storia dei video sul WebLa Web-Tv: una breve storia dei video sul Web
La Web-Tv: una breve storia dei video sul WebAndrea Riezzo
 

Mehr von Andrea Riezzo (13)

12 cose da non fare sui social media
12 cose da non fare sui social media12 cose da non fare sui social media
12 cose da non fare sui social media
 
Creatività, Condivisione e Lavoro Creativo
Creatività, Condivisione e Lavoro CreativoCreatività, Condivisione e Lavoro Creativo
Creatività, Condivisione e Lavoro Creativo
 
Basi di Fotografia e Light-Painting
Basi di Fotografia e Light-PaintingBasi di Fotografia e Light-Painting
Basi di Fotografia e Light-Painting
 
Light-Painting ITA - Introduzione
Light-Painting ITA - IntroduzioneLight-Painting ITA - Introduzione
Light-Painting ITA - Introduzione
 
Briefing su Branding, Colore e Fonts
Briefing su Branding, Colore e FontsBriefing su Branding, Colore e Fonts
Briefing su Branding, Colore e Fonts
 
Logo & Font in un Brand
Logo & Font in un BrandLogo & Font in un Brand
Logo & Font in un Brand
 
Branding e Psicologia del Colore
Branding e Psicologia del ColoreBranding e Psicologia del Colore
Branding e Psicologia del Colore
 
(Breve) Storia del Web Design
(Breve) Storia del Web Design(Breve) Storia del Web Design
(Breve) Storia del Web Design
 
Cosa è successo in soli 6 mesi sul Web
Cosa è successo in soli 6 mesi sul WebCosa è successo in soli 6 mesi sul Web
Cosa è successo in soli 6 mesi sul Web
 
Web Marketing (anche nei social media) spicciolo
Web Marketing (anche nei social media) spiccioloWeb Marketing (anche nei social media) spicciolo
Web Marketing (anche nei social media) spicciolo
 
Il diritto d'autore sul Web
Il diritto d'autore sul WebIl diritto d'autore sul Web
Il diritto d'autore sul Web
 
Breve storia del Web Publishing - editoria sul Web
Breve storia del Web Publishing - editoria sul WebBreve storia del Web Publishing - editoria sul Web
Breve storia del Web Publishing - editoria sul Web
 
La Web-Tv: una breve storia dei video sul Web
La Web-Tv: una breve storia dei video sul WebLa Web-Tv: una breve storia dei video sul Web
La Web-Tv: una breve storia dei video sul Web
 

HTML - Primi Passi

  • 2. UTENTE connesso con un computer uno smartphone un tablet
  • 3. UTENTE INTERNET connesso con la Rete un computer uno smartphone un tablet
  • 4. UTENTE INTERNET SERVER dove risiede connesso con la Rete il sito web richiesto un computer uno smartphone un tablet
  • 5. INDIRIZZO WEB http://google.it UTENTE INTERNET SERVER dove risiede connesso con la Rete il sito web richiesto un computer uno smartphone un tablet
  • 6. INDIRIZZO WEB http://google.it UTENTE INTERNET SERVER dove risiede connesso con la Rete il sito web richiesto un computer uno smartphone un tablet
  • 7. INDIRIZZO WEB http://google.it DOCUMENTO HTML (pagina web) UTENTE INTERNET SERVER dove risiede connesso con la Rete il sito web richiesto un computer uno smartphone un tablet
  • 8. INDIRIZZO WEB http://google.it DOCUMENTO HTML (pagina web) UTENTE INTERNET SERVER dove risiede connesso con la Rete il sito web richiesto un computer uno smartphone un tablet
  • 9. INDIRIZZO WEB http://google.it DOCUMENTO HTML (pagina web) UTENTE INTERNET SERVER dove risiede connesso con la Rete il sito web richiesto un computer uno smartphone un tablet
  • 10. HTML
  • 12.
  • 14.
  • 17. HEADER (testata) MENU di navigazione CONTENUTO
  • 18. HEADER (testata) MENU di navigazione CONTENUTO COLONNA LATERALE suddivisa in “blocchi”
  • 19. HEADER (testata) MENU di navigazione CONTENUTO COLONNA LATERALE suddivisa in “blocchi” FOOTER (pié di pagina)
  • 20. HEADER (testata) MENU di navigazione CONTENUTO COLONNA LATERALE suddivisa in “blocchi” FOOTER (pié di pagina) BODY
  • 21. HTML
  • 23. <html> <head> </head> <body> </body> </html>
  • 24. <html> <head> <title>La Musica</title> </head> <body> </body> </html>
  • 25. <html> <head> <title>La Musica</title> </head> <body> </body> </html>
  • 26. <html> <head> <title>La Musica</title> </head> <body> ... UN SACCO DI ROBA !!! ... </body> </html>
  • 29. <div>
  • 30. <div> l’elemento <div> definisce una sezione della pagina HTML
  • 31. <div> l’elemento <div> definisce una sezione della pagina HTML
  • 32. <body> <div> </div> </body>
  • 33. <body> <div id=”contenitore”> </div> </body>
  • 34. id
  • 35. id l’attributo id specifica un “nome” unico per un elemento HTML
  • 36. <body> <div id=”contenitore”> </div> </body>
  • 37. <body> <div id=”contenitore”> </div> </body>
  • 38. <body> <div id=”contenitore”> </div> </body>
  • 39. <body> <div id=”contenitore”> <div id=”header”> </div> </div> </body>
  • 40. <body> <div id=”contenitore”> <div id=”header”> <h1> </h1> </div> </div> </body>
  • 41. <body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> </div> </body>
  • 42. <h1> l’elemento <h1> indica il titolo più importante del documento HTML
  • 43. <h1> <h2> <h3> <h4> <h5> <h6> i titoli in un documento HTML
  • 44. <body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> </div> </body>
  • 45. <body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> </div> </div> </body>
  • 46. <body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> </div> </div> </body>
  • 47. <body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> </ul> </div> </div> </body>
  • 48. <ul> l’elemento <ul> indica un elenco puntato all’interno del documento HTML
  • 49. <li> l’elemento <li> indica un elemento dell’elenco <ul> all’interno del documento HTML
  • 50. <ul> <li>Elemento 1</li> <li>Elemento 2</li> <li>Elemento 3</li> </ul> esempio del codice
  • 51. Elemento 1 Elemento 2 Elemento 3 come lo vedremo sul browser
  • 52. <body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> </ul> </div> </div> </body>
  • 53. <body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> </li> </ul> </div> </div> </body>
  • 54. <body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> Home </li> </ul> </div> </div> </body>
  • 55. <body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> Home </li> <li> </li> </ul> </div> </div> </body>
  • 56. <body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> Home </li> <li> Chi Siamo </li> </ul> </div> </div> </body>
  • 57. <body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> Home </li> <li> Chi Siamo </li> <li> </li> </ul> </div> </div> </body>
  • 58. <body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> Home </li> <li> Chi Siamo </li> <li> Foto </li> </ul> </div> </div> </body>
  • 59. <body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> Home </li> <li> Chi Siamo </li> <li> Foto </li> <li> Video </li> </ul> </div> </div> </body>
  • 60. <body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> Home </li> <li> Chi Siamo </li> <li> Foto </li> <li> Video </li> </ul> </div> </div> </body>
  • 61. <body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> Home </li> <li> Chi Siamo </li> <li> Foto </li> <li> Video </li> </ul> </div> </div> </body>
  • 62. <body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> Home </li> <li> Chi Siamo </li> <li> Foto </li> <li> Video </li> </ul> </div> </div> </body>
  • 63. <body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> Home </li> <li> Chi Siamo </li> <li> Foto </li> <li> Video </li> </ul> </div> </div> </body>
  • 64. <body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> Home </li> <li> Chi Siamo </li> <li> Foto </li> <li> Video </li> </ul> </div> </div> </body>
  • 65. <body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> Home </li> <li> Chi Siamo </li> <li> Foto </li> <li> Video </li> </ul> </div> <div id=”contenuto”> </div> </div> </body>
  • 66. <body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> Home </li> <li> Chi Siamo </li> <li> Foto </li> <li> Video </li> </ul> </div> <div id=”contenuto”> </div> </div> </body>
  • 67. <body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> Home </li> <li> Chi Siamo </li> <li> Foto </li> <li> Video </li> </ul> </div> <div id=”contenuto”> </div> </div> </body>
  • 68. <body> <div id=”contenitore”> <div id=”header”> <h1> Il mini sito della Musica </h1> </div> <div id=”menu”> <ul> <li> Home </li> <li> Chi Siamo </li> <li> Foto </li> <li> Video </li> </ul> </div> <div id=”contenuto”> </div> </div> </body>
  • 70. <div id=”contenuto”> <h1> </h1> </div>
  • 71. <div id=”contenuto”> <h1> La Musica: le origini </h1> </div>
  • 72. <div id=”contenuto”> <h1> La Musica: le origini </h1> <p> </p> </div>
  • 73. <div id=”contenuto”> <h1> La Musica: le origini </h1> <p> </p> </div>
  • 74. <div id=”contenuto”> <h1> La Musica: le origini </h1> <p> <img src=”speaker.jpg” width=”400” height=”300” alt=”cassa” /> </p> </div>
  • 75. <div id=”contenuto”> <h1> La Musica: le origini </h1> <p> <img src=”speaker.jpg” width=”400” height=”300” alt=”cassa” /> </p> </div>
  • 76. <img> l’elemento <img> indica un’immagine all’interno del documento HTML con l’aiuto degli attributi src, width, height e alt
  • 77. src definisce il percorso del file width definisce la larghezza dell’immagine height definisce l’altezza dell’immagine alt definisce il testo alternativo all’immagine
  • 78. <img>
  • 79. <img >
  • 85. <img src=”immagine.jpg” width=”400” height=”300” alt=”Immagine a caso” >
  • 86. <img src=”immagine.jpg” width=”400” height=”300” alt=”Immagine a caso” />
  • 87. <div id=”contenuto”> <h1> La Musica: le origini </h1> <p> <img src=”speaker.jpg” width=”400” height=”300” alt=”cassa” /> </p> <p> </p> </div>
  • 88. <div id=”contenuto”> <h1> La Musica: le origini </h1> <p> <img src=”speaker.jpg” width=”400” height=”300” alt=”cassa” /> </p> <p> </p> </div>
  • 89. <div id=”contenuto”> <h1> La Musica: le origini </h1> <p> <img src=”speaker.jpg” width=”400” height=”300” alt=”cassa” /> </p> <p> La musica è l'arte e la scienza dell'organizzazione dei suoni nel corso del tempo. Si tratta di arte in quanto complesso di norme pratiche adatte a conseguire determinati gradevoli effetti sonori, che riescono ad esprimere l'interiorità dell'individuo, si tratta di scienza in quanto studio della nascita, dell'evoluzione e dell'analisi dell'intima struttura della musica. </p> </div>
  • 90. <div id=”contenuto”> <h1> La Musica: le origini </h1> <p> <img src=”speaker.jpg” width=”400” height=”300” alt=”cassa” /> </p> <p> La musica è l'arte e la scienza dell'organizzazione dei suoni nel corso del tempo. Si tratta di arte in quanto complesso di norme pratiche adatte a conseguire determinati gradevoli effetti sonori, che riescono ad esprimere l'interiorità dell'individuo, si tratta di scienza in quanto studio della nascita, dell'evoluzione e dell'analisi dell'intima struttura della musica. </p> </div>
  • 91. <div id=”contenuto”> <h1> La Musica: le origini </h1> <p> <img src=”speaker.jpg” width=”400” height=”300” alt=”cassa” /> </p> <p> La musica è l'arte e la scienza dell'organizzazione dei suoni nel corso del tempo. Si tratta di arte in quanto complesso di norme pratiche adatte a conseguire determinati gradevoli effetti sonori, che riescono ad esprimere l'interiorità dell'individuo, si tratta di scienza in quanto studio della nascita, dell'evoluzione e dell'analisi dell'intima struttura della musica. </p> <p>Il generare suoni avviene mediante il canto o mediante strumenti musicali che, attraverso i principi dell'acustica, provocano la percezione uditiva e l'esperienza emotiva voluta dall'artista. </p> </div>
  • 92. <div id=”contenuto”> <h1> La Musica: le origini </h1> <p> <img src=”speaker.jpg” width=”400” height=”300” alt=”cassa” /> </p> <p> La musica è l'arte e la scienza dell'organizzazione dei suoni nel corso del tempo. Si tratta di arte in quanto complesso di norme pratiche adatte a conseguire determinati gradevoli effetti sonori, che riescono ad esprimere l'interiorità dell'individuo, si tratta di scienza in quanto studio della nascita, dell'evoluzione e dell'analisi dell'intima struttura della musica. </p> <p>Il generare suoni avviene mediante il canto o mediante strumenti musicali che, attraverso i principi dell'acustica, provocano la percezione uditiva e l'esperienza emotiva voluta dall'artista. </p> <p>Il significato del termine musica non è comunque univoco ed è molto dibattuto tra gli studiosi per via delle diverse accezioni utilizzate nei vari periodi storici. </p> </div>
  • 93. <div id=”contenuto”> <h1> La Musica: le origini </h1> <p> <img src=”speaker.jpg” width=”400” height=”300” alt=”cassa” /> </p> <p> La musica è l'arte e la scienza dell'organizzazione dei suoni nel corso del tempo. <strong>Si tratta di arte</strong> in quanto complesso di norme pratiche adatte a conseguire determinati gradevoli effetti sonori, che riescono ad esprimere l'interiorità dell'individuo, si tratta di scienza in quanto studio della nascita, dell'evoluzione e dell'analisi dell'intima struttura della musica.</p> <p>Il generare suoni avviene mediante il canto o mediante strumenti musicali che, attraverso i principi dell'acustica, provocano la percezione uditiva e l'esperienza emotiva voluta dall'artista. </p> <p>Il significato del termine musica non è comunque univoco ed è molto dibattuto tra gli studiosi per via delle diverse accezioni utilizzate nei vari periodi storici. </p> </div>
  • 94. <strong> il tag <strong> indica il grassetto di un testo all’interno del documento HTML
  • 95. <div id=”contenuto”> <h1> La Musica: le origini </h1> <p> <img src=”speaker.jpg” width=”400” height=”300” alt=”cassa” /> </p> <p> La musica è l'arte e la scienza dell'organizzazione dei suoni nel corso del tempo. <strong>Si tratta di arte</strong> in quanto complesso di norme pratiche adatte a conseguire determinati gradevoli effetti sonori, che riescono ad esprimere l'interiorità dell'individuo, si tratta di scienza in quanto studio della nascita, dell'evoluzione e dell'analisi dell'intima struttura della musica.</p> <p>Il <em>generare suoni</em> avviene mediante il canto o mediante strumenti musicali che, attraverso i principi dell'acustica, provocano la percezione uditiva e l'esperienza emotiva voluta dall'artista. </p> <p>Il significato del termine musica non è comunque univoco ed è molto dibattuto tra gli studiosi per via delle diverse accezioni utilizzate nei vari periodi storici. </p> </div>
  • 96. <em> il tag <em> indica il corsivo di un testo all’interno del documento HTML
  • 97. <div id=”contenuto”> <h1> La Musica: le origini </h1> <p> <img src=”speaker.jpg” width=”400” height=”300” alt=”cassa” /> </p> <p> La musica è l'arte e la scienza dell'organizzazione dei suoni nel corso del tempo. <strong>Si tratta di arte</strong> in quanto complesso di norme pratiche adatte a conseguire determinati gradevoli effetti sonori, che riescono ad esprimere l'interiorità dell'individuo, si tratta di scienza in quanto studio della nascita, dell'evoluzione e dell'analisi dell'intima struttura della musica.</p> <p>Il <em>generare suoni</em> avviene mediante il canto o mediante strumenti musicali che, attraverso i principi dell'acustica, provocano la percezione uditiva e l'esperienza emotiva voluta dall'artista. </p> <p>Il significato del termine musica non è comunque univoco ed è molto dibattuto tra gli studiosi per via delle diverse accezioni utilizzate nei vari periodi storici. </p> </div>
  • 98. <div id=”contenuto”> <h1> La Musica: le origini </h1> <p> <img src=”speaker.jpg” width=”400” height=”300” alt=”cassa” /> </p> <p> La musica è l'arte e la scienza dell'organizzazione dei suoni nel corso del tempo. <strong>Si tratta di arte</strong> in quanto complesso di norme pratiche adatte a conseguire determinati gradevoli effetti sonori, che riescono ad esprimere l'interiorità dell'individuo, si tratta di scienza in quanto studio della nascita, dell'evoluzione e dell'analisi dell'intima struttura della musica.</p> <p>Il <em>generare suoni</em> avviene mediante il canto o mediante strumenti musicali che, attraverso i principi dell'acustica, provocano la percezione uditiva e l'esperienza emotiva voluta dall'artista. </p> <p>Il significato del termine <a href=”http://www.google.it”>musica</a> non è comunque univoco ed è molto dibattuto tra gli studiosi per via delle diverse accezioni utilizzate nei vari periodi storici.</p> </div>
  • 99. <a> il tag <a> indica un collegamento all’interno del documento HTML con l’aiuto dell’attributo href che ne definisce la “destinazione”
  • 103. COSA NON FARE 1. dimenticare di chiudere i tag HTML
  • 104. <p>Il significato del termine musica è <strong>dibattuto tra gli studiosi per via delle diverse accezioni utilizzate nei vari periodi storici.</p>
  • 105. <p>Il significato del termine musica è <strong>dibattuto tra gli studiosi per via delle diverse accezioni utilizzate nei vari periodi storici.</p> NO
  • 106. <p>Il significato del termine musica è <strong>dibattuto<strong> tra gli studiosi per via delle diverse accezioni utilizzate nei vari periodi storici.</p> NO
  • 107. <p>Il significato del termine musica è <strong>dibattuto</strong> tra gli studiosi per via delle diverse accezioni utilizzate nei vari periodi storici.</p> SÌ
  • 108. COSA NON FARE 1. dimenticare di chiudere i tag HTML
  • 109. COSA NON FARE 1. dimenticare di chiudere i tag HTML 2. chiudere i tag HTML con ordine
  • 110. <p><strong>Il generare suoni avviene mediante il canto o mediante strumenti musicali </p> </strong> NO
  • 111. <p><strong>Il generare suoni avviene mediante il canto o mediante strumenti musicali</strong> </p> SÌ
  • 112. COSA NON FARE 1. dimenticare di chiudere i tag HTML 2. chiudere i tag HTML con ordine
  • 113. COSA NON FARE 1. dimenticare di chiudere i tag HTML 2. chiudere i tag HTML con ordine 3. racchiudere un tag <div>, <h1>, <h2>, <p> (ecc) da un <a> per creare un link
  • 114. <a> <h2> La Musica: le origini</h2> </a> <a> <p>Il significato del termine musica è dibattuto tra gli studiosi per via delle diverse accezioni utilizzate nei vari periodi storici. </p> </a> NO
  • 115. <a> <h2> La Musica: le origini</h2> <p>Il significato del termine musica è dibattuto tra gli studiosi per via delle diverse accezioni utilizzate nei vari periodi storici. </p> </a> NO
  • 116. <h2> <a> La Musica: le origini </a> </h2> <p><a>Il significato del termine musica è dibattuto tra gli studiosi per via delle diverse accezioni utilizzate nei vari periodi storici. </a> </p> SÌ

Hinweis der Redaktion

  1. \n
  2. \n
  3. \n
  4. \n
  5. \n
  6. \n
  7. \n
  8. \n
  9. \n
  10. \n
  11. \n
  12. \n
  13. \n
  14. \n
  15. \n
  16. \n
  17. \n
  18. \n
  19. \n
  20. \n
  21. \n
  22. \n
  23. \n
  24. \n
  25. \n
  26. \n
  27. \n
  28. \n
  29. \n
  30. \n
  31. \n
  32. \n
  33. \n
  34. \n
  35. \n
  36. \n
  37. \n
  38. \n
  39. \n
  40. \n
  41. \n
  42. \n
  43. \n
  44. \n
  45. \n
  46. \n
  47. \n
  48. \n
  49. \n
  50. \n
  51. \n
  52. \n
  53. \n
  54. \n
  55. \n
  56. \n
  57. \n
  58. \n
  59. \n
  60. \n
  61. \n
  62. \n
  63. \n
  64. \n
  65. \n
  66. \n
  67. \n
  68. \n
  69. \n
  70. \n
  71. \n
  72. \n
  73. \n
  74. \n
  75. \n
  76. \n
  77. \n
  78. \n
  79. \n
  80. \n
  81. \n
  82. \n
  83. \n
  84. \n
  85. \n
  86. \n
  87. \n
  88. \n
  89. \n
  90. \n
  91. \n
  92. \n
  93. \n
  94. \n
  95. \n
  96. \n
  97. \n
  98. \n
  99. \n
  100. \n
  101. \n
  102. \n
  103. \n
  104. \n
  105. \n
  106. \n
  107. \n
  108. \n
  109. \n
  110. \n
  111. \n
  112. \n
  113. \n
  114. \n
  115. \n
  116. \n
  117. \n