 |
Riepilogo - Body Testi Tabelle
|
Fino ad ora abbiamo esaminato i codici che costituiscono l'ossatura dei siti e anche se le tabelle possono ,
in molti casi, essere sostituite dai CSS esse rimangono tutt'ora valide. La gestione dei testi in HTML e' piuttosto scarsa di opzioni e quindi deve essere ottimizzata con i CSS ed anche se il sito che si vorra' realizzare ne fara' un uso limitato e' utile un file di supporto basato sui CSS che li gestisca. Avremo occasione di ritornare sull'argomento. ed ora vediamo cio' che abbiamo appreso fino ad ore. BODYE' il tag che racchiude la parte eseguibile della pagina HTML.A Body vengono associati questi attributi anche se oggi si preferisce fare uso dei CSS che consentono piu' opzioni: Le TABELLECome gia' scritto una tabella, per essere gestita al meglio, deve essere inserita in un contenitore e questo e' rappresentato con il tag DIVDIV fondamentalmente divide blocchi e sezioni in HTML. Anche DIV trova largo uso con i CSS. Ad esso vengono assegnati i seguenti attributi:
TABLE identifica la tabella alla quale vengono associati i seguenti attributi tra i quali non citiamo align che anche se previsto viene gia' inserito in DIV. Il tag Table accetta ancora gli attributi Frame e Rules che pero' non consideriamo poiche' non supportati da alcuni Browser. Gli atrtibuti relativi a table possono essere inseriti insieme come in questo caso: <table border="0" cellpadding="0" cellspacing="0" width="700" height="100" bordercolor="#ff0000"> Nel suo interno la tabella viene divisa in righe e colonne con l'impiego dei tag TR e TDNota: L' attibuto align ha le seguenti caratteristiche: left, right, center, justify L' attibuto valign ha le seguenti caratteristiche: top, middle, bottom Tutti possono essere inseriti insieme <tr align="right" bgcolor="0000ff" valign="middle"> TD definisce la cella alla quale vengono associati i seguenti attributi validi fino alla chiusura del tag /TD: Nota: L' attibuto align ha le seguenti caratteristiche: left, right, center, justify L' attibuto valign ha le seguenti caratteristiche: top, middle, bottom Tutti possono essere inseriti insieme <td align="left" bgcolor="#0000ff" valign="top" width="300" height="50"> Poiche' il concetto relativo a colspan e rowspan e' abbastanza ostico , qui di seguito 2 brevi esempi dove definiremo anche il colore di sfondo della pagina, il colore di sfondo delle celle ed il carattere che sara' di default. Vedremo anche come questo carattere possa venire cambiato, allineato, colorato e dimensionato all'interno dei tag , in questo caso TR ed una volta chiuso con /TR tornare quello definito nel tag body:ROWSPAN - COLSPAN Il TESTOLa gestione del testo e' stata vista nella sezione 2 ma qui, per non ripeterci vogliamo portare alcuni esempi su come il testo puo' venire gestito in una pagina HTML senza fare un uso totale dei CSS:In Html i caratteri sono definiti con il tag FONT che pero' in pratica si evita di usare anche se per dovere di documentazione ne vediamo qui i dettagli:
Carattere Verdana, grandezza 3, colore verde Possiamo inserire le istruzioni direttamente sulla pagina o inserirli in un file con estensione css che verra' caricato tra i tag Head della pagina : <link rel="stylesheet" href="../alvin.css" type="text/css" /> Vediamo ora un file css che contenga alcune definizioni di caratteri:/* Tra questi delimitatori vanno i commenti */
Questo listato lo salveremo con estensione css tipo miocss.css In pratica abbiamo creato delle classi che verranno applicate al testo da definire e saranno attivate con i tag a - span o inserite tra i tag TD o TR.
Nel caso in cui serva un carattere non contenuto nel nostro file css lo si definisce con l'istruzione style Attenzione: Style NON puo' definire una class. <style cless="txt"> NON funziona. La definizione con style puo' essere inserita tra i tag Body - TR - TD - P - A - SPAN e all'interno di un testo Questo testo e' definito come testo di default mentre ora si colora di rosso per poi tornare normale. Ma si puo' anche cambiare carattere come il calibri 16 pixel che ora e' tornato normale Questo testo e' definito come testo di default mentre ora <a style="color:#ff0000"> si colora di rosso </a> per poi tornare normale.<br> Ma si puo' anche cambiare carattere <span style="font-size:16px; color: #ffffff; font-family: calibri;"> come il calibri 16 pixel </span> che ora e' tornato normale |