• User

    Div, Questo Misterioso

    "Un layout table-less si realizza attraverso l'uso dei div. La sua definizione è generic block-level element ossia contenitore generico block level. Il fatto che sia un elemento block-level ci garantisce il fatto che possa contenere qualsiasi tipo di elemento html. Inoltre, la sua presentazione naturale (quindi senza fogli di stile) è totalmente neutra: infatti questo elemento si presenta di default senza margini, bordi o padding. È quindi il contenitore per eccellenza per realizzare layout senza l'uso di tabelle: ad ogni div portante verrà associata una sezione della pagina."

    C'e' qualcuno che sta usando i div invece delle tabelle ? Se si, c'e' una dimostrazione chiara di come va usato' ? :mmm:

    Un caro saluto a tutti Lucy


  • Super User

    Ciao lucy,

    su tanti siti trovi esempi di come viene usato il div.

    In pratica pensa al div come un contenitore vuoto dove puoi inserire i contenuti al suo interno,

    la differenza sostanziale con le tabelle e che il div lo puoi mettere dove vuoi in qualsiasi posizione della pagina.

    Il tutto viene gestito dai css o fogli di stile.Quindi hai anche il vantaggio di non riempire la pagina di codice, ma basta per esempio :

    <div id="header"> contenuto del tuo header </div>
    questo nella pagina html

    in un foglio esterno di stile ( es.stile.css)

    imposti le proprieta per quel div:
    #header
    {
    }
    quello che metti all'interno delle parentesi graffe è codice css, abbastanza semplice da usare e poi oggi la stragrande maggioranza dei programmi come dreamweaver per es. hanno la autocompletazione del codice che ti aiuta e non ti obbliga a ricordare tutte le proprieta a memoria.
    Cosi facendo puoi spostare l'header a destra o a sinistra, in basso , impsotare margini, sfondo distanza alla pagina e tanto altro, per arrivare a funzioni piu avanzate coem bordi arrotondati etc.
    Insomma decisamente un altro mondo rispetto alle tabelle che spesso devi intersecarle tra loro oppure creare celle su sottocelle, ra l'altro riempiendo la pagian di codice.
    QUesta e una spiegazione un po "terra terra" diciamo, ma spero possa darti l'idea , poi naturalmente ti conviene studiare sia i css che l'xhtml e html.

    Vedrai che e molto piu semplice di usare le tabelle.
    se hai problemi noi siamo qua.
    🙂


  • User

    Grazie della risposta, ma vorrei portarti un po' indietro affinche' io possa chiarire i miei dubbi.

    Conosco abbastanza bene DreamWeaver, pero' ora sto lavorando con le tabelle . Ho sentito che i div mi alleggeriscono il codice, e quindi di piu' facile acquisizione.

    Ora io desidero fare una prova , di nuovo sito, e omettere le tabelle. Scivo i vari passagi che devo fare , chiedendo per favore di correggere dove sbaglio grazie.

    Domanda: Dove trovo il div?

    Possibile risposta : menu=> testo=> nuovo

    si apre una finestra nuovo stile css => dove c'e' "tag" io scelgo "div"

    dove c'e' tipo di selettore => io scelgo "tag"

    deinisci in => scelgo la cartella del nuovo.

    Domanda e' cosi' che ho creato il contenitore div dentro il quale inserisco il contenuto? :bho:

    Un simpatico salutoooooooooooooo Lucy


  • Super User

    Per inserire un div con dreamweaver vai su :
    barra degli strumenti->layout->inserisci div
    per inserire un un nuovo css lo trovi a destra nel pannello css.
    devi inpratica creare 2 file separati, in uno metti i div e nell'altro meti il codice css, so che non sembra facile pero spiegarti un argomento cosi vaso in un semplice post.
    ma un consiglio mi sento di dartelo, visto che e un errore molto grave che ho commesso io agli inizi e che mi ha penalizzato tanto, è quello di non affidarti completamente alla creazione visuale, ma imparare a inserire il codice "manualmente" , cosi avrai sempre il controllo totale sul codice.
    puoi partire proprio dalla guida di dreamweaver per i css, e un buon inizio.
    su internet trovi tante guide ai fogli di stile, lo so ci vuole tempo ma prima di capire come inserire un div o un css, devi capire bene cosa sono e come funzionano.
    [url=http://css.html.it/guide/leggi/2/guida-css-di-base/]parti da qua
    comincia creando un semplice layout composto da 4 div:
    header-content-menu-footer-
    poi passa a smanetare con i css per vedere gli effetti sui 4 div e cominic a capire le varie proprieta come si comportano.
    per qualsiasi dubbio posta e noi siamo qua.
    🙂


  • User

    Grande ! Grazie !

    Un caro saluto Lucy