1 / 19

BODY

BODY. A CAPO. Sintassi: <br>(a capo) oppure <hr attributi> (a capo con una linea) attributi: noshade sfuma la linea " size " l’altezza in pixel,

ofira
Download Presentation

BODY

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. BODY A CAPO Sintassi: <br>(a capo) oppure <hr attributi> (a capo con una linea) attributi:noshade sfuma la linea "size" l’altezza in pixel, "width" larghezza in pixel ESEMPIO <br> <hr noshade size="5" width="50%" > 2

  2. BODY Font family 3

  3. BODY GLI ELENCHI • Elenchi ordinati • Elenchi non ordinati • Elenchi di definizioni Sintassi <elenco> <elemento>nome del primo elemento <elemento>nome del secondo elemento ………. …… </elenco> 4

  4. BODY GLI ELENCHI Elenchi ordinati Sintassi <ol> <li>nome del primo elemento <li>nome del secondo elemento ………. …… </ol> ol= order list li=list item Esempio <ol> <li> primo elemento <li>secondo elemento <li>terzo elemento </ol> Testo fuori lista 5

  5. BODY GLI ELENCHI Elenchi ordinati Sintassi <ol type=“attributo”> <li>nome del primo elemento <li>nome del secondo </ol> ol= order list li=list item Attributo:1=numeri arabi; a=alfabeto minuscolo; A=alfabeto maiuscolo; i=romani minuscoli; I=romani maiuscoli Esempio <ol type=“a”> <li> primo elemento <li>secondo elemento <li>terzo elemento </ol> Testo fuori lista 6

  6. BODY GLI ELENCHI Elenchi non ordinati Sintassi <ul>type=“attributo”> <li>nome del primo elemento <li>nome del secondo </ul> ul= unorder list li=list item Attributo:disc=pallino pieno; circle=pallino vuoto; square=quadrato pieno; Esempio <ul type=“circle”> <li> primo elemento <li>secondo elemento <li>terzo elemento </ul> Testo fuori lista 7

  7. BODY GLI ELENCHI Elenchi di definizioni Sintassi <dl>> <attr>nome del primo elemento <attr>nome del secondo </dl> dl= definition list Attributo: dt=senza rientro; dd= con rientro; Esempio <dl> <dd>nome del primo elemento <dd>nome del secondo </dl> 8

  8. Ipertesti I LINK I link sono "il ponte" che consente di passare da un testo all’altro • Sono formati da: • la risorsa verso cui il collegamento punta • contenuto che "nasconde“ il collegamento (non importa se si tratta di testo, di immagine o di files) Sintassi: <a href=“risorsa">contenuto</a> ESEMPIO <a href=“www.cataniaedintorni.it">notizie su Catania e non solo</a> Nota bene Per motivi di sicurezza non è possibile eseguire un file ".exe" direttamente dal web; l’utente dovrà sempre prima scaricarlo sul proprio PC. 9

  9. Ipertesti I LINK Nota bene E’ opportuno dividere il sito in varie sezioni, in modo da avere tutti i documenti dello stesso tipo all’interno di un contesto omogeneo. Per creare collegamenti verso i documenti più reconditi, destreggiandoci tra le strutture più ramificateesistono due tecniche: indicare un percorso assoluto Viene utilizzato per far riferimento ad un percorso certo(se si è già in possesso di un proprio sito) http://www.itcdefelice.it/corsi/programmatori/materie.html indicare un percorso relativo Viene utilizzato per far riferimento ad un percorso ancora da definire(se non si è già in possesso di un proprio sito) 10

  10. Ipertesti UN TITOLO AI LINK L’attributo title è molto importante, e serve per descrivere l’elemento a cui fa riferimento il link. Sintassi: <a title=“commento" href=URL" > testo</a> Nota bene L’attributo title è molto importante per descrivere l’elemento a cui fa riferimento il link ed è anche utilissimo per migliorare la propria presenza nei motori di ricerca, che ne vanno a leggere il contenuto. 11

  11. Href Ipertesti • Per far riferimento a un file che si trovi all’interno della stessa directory basta linkare il nome del file • <a href="paginaDaLinkare.html">pagina</a> • Per far riferimento a un file contenuto in una cartella di livello inferiore alla posizione corrente, nominare la cartella seguita dallo "slash", e poi il nome del file.<a href="prima/interna/interna.html">pagina interna</a> • Per tornare su di un livello, è sufficiente utilizzare la notazione • <a href="../../index.html">pagina interna</a> 12

  12. ancore • Link interni alla stessa pagina • Ci permettono di scorrere la pagina fra un punto e un altro sfruttando il meccanismo ad indice • Sono costituiti da due parti: • RISORSA CHE PUNTA • <a href="#primo">Primo paragrafo</a> • RISORSA PUNTATA • <a name="primo"><h3>Primo paragrafo</h3></a> 13

  13. Vediamo un esempio E poi costruimao un esempio di due pagine collegate fra loro e che sfruttino le ancore.

  14. Img

  15. Inutile provare dunque a inserire un file ".psd" (formato nativo di Photoshop) all'interno della vostra pagina HTML: con grande probabilità il browser non caricherà il file (dovete infatti prima convertire il file in uno dei formati sopra-indicati). È importante ricordare che il codice HTML fornisce delle indicazioni al browser su come visualizzare il testo e le immagini - ed eventualmente i video e i suoni - all'interno della pagina: il testo (come abbiamo visto) è scritto direttamente nel file HTML, le immagini invece sono caricate insieme alla pagina.

  16. <img src="logo.gif" alt=” logo” width="224" height="69" />

  17. Immagini con link <a href="http://www.sito.it" target="_blank"> <img src="logo.gif" border="0" width="224" height="69" /></a>

More Related