Inserimento e formattazione di base del testo

Guida HTML 2

« Older   Newer »
 
  Share  
.
  1.     +2   +1 Like   Dislike
     
    .
    Avatar

    Advanced Member

    Group
    WR|Special
    Posts
    5,583
    Reputazione
    0
    Location
    New York - Maclaren's pub

    Status
    Anonymous

    Inserimento e formattazione di base del testo



    Il testo è uno dei contenuti principali delle pagine web.
    Esso viene inserito dei documenti HTML attraverso dei tag che hanno un preciso valore sematico e visuale.
    Sinora, tra i vari tag utilizzati per la suddetta finalità, abbiamo incontrato, solamente il tag <p> che permette di definire un paragrafo il cui testo di norma visualizzato con l'aggiunta di una spaziatura superiore e inferiore.



    Oltre a tale tag ne esistono altri:

    • per la definizione dei titoli (heading), dal più importante, visualizzato in grassetto con il font grande (<h1>), al meno importante, visualizzato in grassetto con font più piccolo (<h6>), passando per titoli intermedi visualizzati con font di dimensioni progressivamente inferiori (<h2>,<h3>,<h4>,<h5>);

    • per la definizione di testo in grassetto o con un'enfasi forte (<b> per bold o <strong>per strongly emphasizes);

    • per la definizione di testo in corsivo o con enfasi (<i> per italico o <em> per emphasided);

    • per la definizione di testo in font monospazio (<kbd> per keyboard, <code> e <samp> per sample);

    • per la definizione di testo preformattato (<pre> per preformatted);

    • per la definizione di un apice o di un esponente (<sup> per superscript) o per un pedice (<sub> per subscript);

    • per la definizione di una sezione il cui testo è una citazione (<blockquote>).


    CODICE
    CODICE
    <!DOCTYPE html>
           <html>
                   <head>
                           <title>Tutto sul testo</title>
                           <meta name="keywords" content="web, html5" charset="utf-8">
                   </head>
                   <body>
                           <hgroup>
                                   <h1>Benvenuti nel fantastico mondo della programmazione del web</h1>
                                   <h3>Una guida per tutti dove imparerete come diventare dei web developer!!</h3>
                           </hgroup>
                           <p>&copy; 2012 Pellegrino <b><i>~thp~</i></b> Principe</p>
                           <p><strong>N.B.</strong> Ricordiamo di avere sempre a portata di mano la più recente specifica di HTML5<sup>1</sup></p>
                           <h5><sup>1</sup> http://www.whatwg.org/spec/web-apps/current-work/multipage/ </h5>
                           <p>Un pò di codice di esempio in JavaScript:</p>
                           <pre>
                                   var j=10;
                                   var data=[];
                                   for(var i=0; i<j; i++)
                                           data[i]=i*2;
                           </pre>
                           <p>Ecco una citazione su JavaScript dal guru Duglas Crockford:</p>
                           <blockquote cite="http://javascript.crockford.com/javascript.html">
                                   <em>JavaScript, aka Mocha, aka LiveScript, aka JScript, aka ECMAScript...</em>
                           </blockquote>
                   </body>
           </html>


    Esempio

    Il codice mostra come utilizzare i tag precedentemente esaminati per creare una struttura di documento HTML dove abbiamo:

    • due titoli, inseriti nel tag <hgroup>, che consente di ragruppare titoli secondo una strutturazione per livelli multipli (per esempio titolo e sottotitolo);

    • una serie di paragrafi, dove in alcune parti del testo sono stati usati dei marcatori per dare una certa importanza (<strong>) o enfatizzare (<em>) determinate parole. E' stato usato anche il tag <sup>, che ha permesso di creare un riferimento in apice sul carattere 1;

    • del testo che rappresenta del codice JavaScript che è stato visualizzato in modo preformattato (<pre>), ossia considerando tutti gli spazi e i ritorni a capo così come sono stati, parola per parola, digitati;

    • del testo che indica una citazione di un guru del linguaggio JavaScript inserita nel tag <blockquote> sul quale abbiamo usato l'attributo cite per indicare l'indirizzo web della pagina originaria.

    Nel codice abbiamo utilizzato una speciale combinazione di caratteri formati dal simbolo di ampersand(&), un nome abbreviato e il carattere punto e virgola per far si che il browser visualizzasse il simbolo copyright (©). Esistono molte combinazioni di tali caratteri, definiti nol loro insieme come character entities, che consentono, per l'appunto, di visualizzare in una pagina web dei caratteri speciali. Tra di essi, uno spesso utilizzato è quello codificato come  , denominato non-breaking space. Consente di "forzare" l'inserimento di caratteri di spazio ed è indispensabile quando si ha la necessità di visualizzare parole separate non da uno, ma da più spazi.




    Guida a cura di ©True Story

     
    .
  2.     +1 Like   Dislike
     
    .
    Avatar

    Advanced Member

    Group
    Gestore
    Posts
    6,183
    Reputazione
    +8
    Location
    vicenza, veneto

    Status
    Anonymous
    Ottima guida :D
    Magari mi metto pure io a studiare un po' di codici xD
     
    .
  3.     +1 Like   Dislike
     
    .
    Avatar

    Advanced Member

    Group
    WR|Special
    Posts
    5,583
    Reputazione
    0
    Location
    New York - Maclaren's pub

    Status
    Anonymous
    di certo non ti farebbe male XD
     
    .
2 replies since 21/8/2014, 17:19   42 views
  Share  
.