[BASE] Introduzione all'html.

Livello di difficoltà: basso.

« Older   Newer »
 
  Share  
.
  1.  
    .
    Avatar


    Group
    admin
    Posts
    11,881
    Location
    Salerno.

    Status
    Hasu
    Salve e benvenuti in questo topic! Affronteremo qui di seguito i basilari codici html che è sempre bene conoscere, quando ci si trova a frequentare un forum. Questo elenco è dedicato in maniera speciale a coloro che si trovano a confrontarsi con i codici html per la prima volta.
    Ricordatevi che per modificare la caratteristica di un qualsiasi elemento web - anche del semplice testo, per fare un esempio - si ha bisogno di "tag" come ad esempio
    CODICE
    <b></b>

    Il tag "< b >" serve a impostare una certa quantità di testo in modalità "grassetto".

    (esempio) Il lost in yaoiland è una figata
    CODICE
    <b>Il lost in yaoiland è una figata</b>

    Per impostare il testo in corsivo, si utilizzerà la tag
    CODICE
    <i></i>

    (esempio) Il lost in yaoiland è una figata
    CODICE
    <i>Il lost in yaoiland è una figata</i>

    Se volete che il vostro testo sia contomporaneamente in grassetto e in corsivo, potete tranquillamente utilizzare entrambe le tag.
    (esempio) Il lost in yaoiland è una figata
    CODICE
    <b><i>Il lost in yaoiland è una figata</i></b>

    NB! Nel momento in cui adoperate le tag, queste devono essere chiuse nell'ordine giusto! Come potete notare sono state posizionate in maniera concentrica. Volendo attribuire un ordine di importanza, si potrebbe dire che in questo caso il corsivo prevale sul grassetto, in quando è il tag più vicino al testo. Sarebbe scorretto scrivere
    CODICE
    <b><i>Il lost in yaoiland è una figata</b></i>

    Bisogna essere ordinati nel richiudere correttamente le tag. Lo slash " / " che inserite la seconda volta, nello scrivere " < b > " per esempio, serve appunto a chiudere la caratteristica che volevate impostare.

    • altre tag di formattazione del testo
    CODICE
    <u> </u> sottolineato
    <del></del> o <s> </s>  linea in mezzo
    <sup></sup> apice
    <sub></sub> pedice


    LINK, ANDARE A CAPO, IMMAGINI

    A questo punto, è bene cominciare a fare una differenziazione fra BBcode e HTML. Il BBcode è quello più comunemente utilizzato nei forum, ed è anche quello che vi compare nel momento in cui adoperate la barra preimpostata di forumfree.



    Per fare un esempio, il codice HTML per inserire un link è
    CODICE
    <a href="link"> testo/immagine </a>

    Mentre nel BBcode si utilizza quest'altra forma.
    CODICE
    [URL=http://indirizzopagina] testo/immagine [/URL]

    La stessa cosa vale anche per le immagini. La versione html del codice è
    CODICE
    <img src="indirizzoimmagine">

    Mentre quella BBcode è
    CODICE
    [IMG]indirizzo immagine[/IMG]

    Per sapere come caricare un'immagine, vi invitiamo a controllare il nostro tutorial ( click ! ) a riguardo.

    Di conseguenza, se volete che cliccando su un'immagine si raggiunga una pagina, un topic, o un'altra immagine, il codice da usare è
    CODICE
    <a href="indirizzo_sito"><img src="indirizzo_immagine"></a>

    Come potete notare è lo stesso codice dei banner.

    Per andare a capo, in ambito html, si utilizza il tag " < br > "
    CODICE
    <br>

    Nel forum non ne avrete bisogno, quando scrivete nelle discussioni. Però in alcune parti del vostro profilo utente (ad esempio nello spazio che compare sotto l'avatar, o alla voce "interessi) sarà necessario utilizzarlo per andare da capo.

    Per creare una linea separatrice come questa
    il codice da usare è
    CODICE
    <hr>


    Per allineare a sinistra, centro e destra il testo, potete utilizzare vari codici. Quello in BBcode fornito da forumfree è
    CODICE
    [CENTER][/CENTER]

    Ma potete utilzzare anche la variante " p align="center ". Tenete presente però che utilizzando il codice " p " vi verrà uno spazio automatico sia sopra che sotto il vostro testo. Ad esempio.

    " Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

    PROVAPROVAPROVA

    Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
    CODICE
    " Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."<p align="center">[color=orange]PROVAPROVAPROVA[/color]</p> Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. "

    Se volete che la scritta in arancio non abbia spazi nè sopra nè sotto, utilizzare il codice " div "
    CODICE
    <div align="center">

    Per saperne di più sul "div" controllate il (link) nostro tutorial (click!) in proposito.
    Per allineare a sinistra, invece di scrivere "center" utilizzate la parola "left". Per allineare a destra, scrivere "right". Funziona sia con p, che con div.

    Nota: " < p > " è l'attributo che definisce un paragrafo.
    (esempio)
    <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. <p> Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
    CODICE
    <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. <p> Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

    Potrete andare a capo posizionandolo in un punto del testo a vostra scelta.


    In caso di dubbi e perplessità utilizzate questo topic (click!), servendovi di questo piccolo modulo per porre la domanda.

    Tutorial di riferimento nome tutorial
    Domanda
    CODICE
    <b>Tutorial di riferimento</b> <a href="link tutorial"> nome tutorial </a>
    <b>Domanda </b>


    Edited by endorphine - 20/12/2011, 12:24
     
    .
0 replies since 1/9/2011, 11:48   160 views
  Share  
.