Salve,
questa guida espone delle regole , ben precise , sul funzionamento del linguaggio CSS. Non stiamo qui a parlare di teorie o di significati, partiamo subito con il volume 1 della guida che scrivero' per inforge.net e per i propri utenti.
Questa guida non e' completa, e' scritta da uno sviluppatore di sitiweb il quale non da molto ha trovato questa passione , se cosi' si puo' chiamare. Forse un hobby, forse un metodo per passare il tempo! Anche il sottoscritto ha iniziato modificando dei template e capendone il significato modificando in modo un po' bizzarro la sintassi finale, e modificando qua' e la' dettagli molto importanti, all'epoca da me non conosciuti. Come il progetto "beneficienza" sono qui per aiutare ancora una volta! In questo caso,come nei prossimi, voi e la gente interessata all'apprensione del webdesign! O almeno, le sue basi.
Oggi parleremo di poche cose, ma significative! Ecco l'elenco
1) Come aggiungere un div.
2) Aggiungere un immagine al div interessato.
3) I margini
4) La posizione:centrale,sinistra,destra.
5) Altezza e larghezza.
Come aggiungere un div al proprio foglio di stile!
Aggiungere un div e' molto semplice. Il "div" viene chiamato in questo modo per un semplice motivo. Il collegamento alla sintassi finale di tutti gli elementi. Questa e' una spiegazione molto
sintetica. Non serve sapere tutto, basta sapere che viene caratterizzato come un elemento. Un elemento che verra' sempre collegato ad una pagina staccata! Il php, dove vengono elencati in ordine piacimentale i nomi degli elementi aggiunti nel CSS. Questo avverra' con un codice, il quale fornira' alla pagina le caratteristiche, enunciandone semplicemente il nome.
Ecco il codice per aggiungere un elemento. Senza le "-"
Come aggiungere un'immagine al proprio elemento.
L'elemento , il div , molte volte presenta un'immagine.Un immagine che puo' essere spostata a destra e a sinistra a nostro piacimento. Come qualsiasi oggetto. L'unica cosa che non accomuna un oggetto in vita reale e la nostra immagine e' la presenza di uno schermo davanti a noi. Quindi, per spostarla dovremmo utilizzare una tastiera.Prima di divertirci o infuriarci sullo spostamento esatto dell'immagine, dobbiamo averla. Dobbiamo saperla inserire, rinominare e cercarne l'url.
Ecco il codice per aggiungere l'immagine ad un elemento(div).Per far ripetere l'immagine orizzontalmente e verticalmente contemporaneamente, togliamo il "0 0 no-repeat" e lasciamo il ;
In questo caso l'immagine intro.png si trova nella cartella images. Possiamo modificare sia nome che cartella ma dev'essere il vero nome e la vera cartella in cui l'immagine si trova. Se non e' cosi' l'immagine non si vedra'.
Come dettagliare margini e spazi.
Questo e' molto semplice, anzi semplicissimo! Bastera' aggiungere al nostro div una nuova frase.
Una frase conclusa dal ;.
Il margine puo' essere alto(top), basso(bottom),sinistro(left) e destro(right).
Per spostare l'immagine o un testo ecc.. usare uno di questi codici! La misura cambia a seconda dei nostri parametri. 10px; e' la misura in pixel che ho scielto, ma come detto prima puo' cambiare.
Il posizionamento di immagini, testi o elementi.
Questo puo' servire davvero molto. Non solo con immagini, ma con qualsiasi tipo di testo.
Il float spostera' gia' in modo equo il vostro testo o immagine. Caricandolo centralmente o ai due lati. Destra e sinistra! Non e' molto difficile da capire, e' piu' facile a fare che a dire!
Il posizionamento che vi pone il float e' basico. Infatti potra' essere modificato da voi con il punto precedente!
Ecco il codice per far posizionare in una delle 3 sezioni il vostro testo o immagine. Centro (center),destra (right), sinistra (left).Come tutte le altre frasi, andra' conclusa con il ;.
Sapere l'altezza e la larghezza di un immagine.
Sapere le dimensioni dell'immagine puo' essere molto utile. Se l'immagine la si ha creata proprio pochi minuti prima dell'aggiunta della frase nel css, e' proprio improbabile non saperla.
Le dimensioni sono determinate , anche qui , da unita' di misura "pixel". Altezza(height),larghezza(width).Le dimensioni le potete aggiungere anche in modo non ordinato,
non e' causa di problemi.
Ecco il codice per inserire altezza e larghezza ad un'immagine. Da quello che so' l'immagine non si ridimensionera' se le dimensioni non sono corrette. Restera' identica a prima, solamente con uno spazio un po' piu' ampio.Dove non ci sara' niente.
:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
Il primo volume e' terminato. I 3 volumi che dedichero' a if sono solamente per persone totalmente inesperte. Che vogliono sapere le basi e sapersi muovere nel mondo del CSS.
Spero di essere stato chiaro con le definizioni, alla fine basta sapere un po' di inglese per capirne qualcosa!
Crediti:Huki aka Ganjaman. (IF.NET). Thomas vivian web designer!
:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
questa guida espone delle regole , ben precise , sul funzionamento del linguaggio CSS. Non stiamo qui a parlare di teorie o di significati, partiamo subito con il volume 1 della guida che scrivero' per inforge.net e per i propri utenti.
Questa guida non e' completa, e' scritta da uno sviluppatore di sitiweb il quale non da molto ha trovato questa passione , se cosi' si puo' chiamare. Forse un hobby, forse un metodo per passare il tempo! Anche il sottoscritto ha iniziato modificando dei template e capendone il significato modificando in modo un po' bizzarro la sintassi finale, e modificando qua' e la' dettagli molto importanti, all'epoca da me non conosciuti. Come il progetto "beneficienza" sono qui per aiutare ancora una volta! In questo caso,come nei prossimi, voi e la gente interessata all'apprensione del webdesign! O almeno, le sue basi.
Oggi parleremo di poche cose, ma significative! Ecco l'elenco
1) Come aggiungere un div.
2) Aggiungere un immagine al div interessato.
3) I margini
4) La posizione:centrale,sinistra,destra.
5) Altezza e larghezza.
Come aggiungere un div al proprio foglio di stile!
Aggiungere un div e' molto semplice. Il "div" viene chiamato in questo modo per un semplice motivo. Il collegamento alla sintassi finale di tutti gli elementi. Questa e' una spiegazione molto
sintetica. Non serve sapere tutto, basta sapere che viene caratterizzato come un elemento. Un elemento che verra' sempre collegato ad una pagina staccata! Il php, dove vengono elencati in ordine piacimentale i nomi degli elementi aggiunti nel CSS. Questo avverra' con un codice, il quale fornira' alla pagina le caratteristiche, enunciandone semplicemente il nome.
Ecco il codice per aggiungere un elemento. Senza le "-"
Codice:
#"elemento" {Come aggiungere un'immagine al proprio elemento.
L'elemento , il div , molte volte presenta un'immagine.Un immagine che puo' essere spostata a destra e a sinistra a nostro piacimento. Come qualsiasi oggetto. L'unica cosa che non accomuna un oggetto in vita reale e la nostra immagine e' la presenza di uno schermo davanti a noi. Quindi, per spostarla dovremmo utilizzare una tastiera.Prima di divertirci o infuriarci sullo spostamento esatto dell'immagine, dobbiamo averla. Dobbiamo saperla inserire, rinominare e cercarne l'url.
Ecco il codice per aggiungere l'immagine ad un elemento(div).Per far ripetere l'immagine orizzontalmente e verticalmente contemporaneamente, togliamo il "0 0 no-repeat" e lasciamo il ;
Codice:
background: url('images/intro.png') 0 0 no-repeat;Come dettagliare margini e spazi.
Questo e' molto semplice, anzi semplicissimo! Bastera' aggiungere al nostro div una nuova frase.
Una frase conclusa dal ;.
Il margine puo' essere alto(top), basso(bottom),sinistro(left) e destro(right).
Per spostare l'immagine o un testo ecc.. usare uno di questi codici! La misura cambia a seconda dei nostri parametri. 10px; e' la misura in pixel che ho scielto, ma come detto prima puo' cambiare.
Codice:
margin-top:10px;
Codice:
margin-bottom:10px;
Codice:
margin-right:10px;
Codice:
margin-left:10px;Il posizionamento di immagini, testi o elementi.
Questo puo' servire davvero molto. Non solo con immagini, ma con qualsiasi tipo di testo.
Il float spostera' gia' in modo equo il vostro testo o immagine. Caricandolo centralmente o ai due lati. Destra e sinistra! Non e' molto difficile da capire, e' piu' facile a fare che a dire!
Il posizionamento che vi pone il float e' basico. Infatti potra' essere modificato da voi con il punto precedente!
Ecco il codice per far posizionare in una delle 3 sezioni il vostro testo o immagine. Centro (center),destra (right), sinistra (left).Come tutte le altre frasi, andra' conclusa con il ;.
Codice:
float:center;
Codice:
float:right;
Codice:
float:left;Sapere l'altezza e la larghezza di un immagine.
Sapere le dimensioni dell'immagine puo' essere molto utile. Se l'immagine la si ha creata proprio pochi minuti prima dell'aggiunta della frase nel css, e' proprio improbabile non saperla.
Le dimensioni sono determinate , anche qui , da unita' di misura "pixel". Altezza(height),larghezza(width).Le dimensioni le potete aggiungere anche in modo non ordinato,
non e' causa di problemi.
Ecco il codice per inserire altezza e larghezza ad un'immagine. Da quello che so' l'immagine non si ridimensionera' se le dimensioni non sono corrette. Restera' identica a prima, solamente con uno spazio un po' piu' ampio.Dove non ci sara' niente.
Codice:
height:1000px;
width:1700px;:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
Il primo volume e' terminato. I 3 volumi che dedichero' a if sono solamente per persone totalmente inesperte. Che vogliono sapere le basi e sapersi muovere nel mondo del CSS.
Spero di essere stato chiaro con le definizioni, alla fine basta sapere un po' di inglese per capirne qualcosa!
Crediti:Huki aka Ganjaman. (IF.NET). Thomas vivian web designer!
:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
. Certe cose le scrivero' nel prossimo volume, ora aspetto un po'.