Primo File.css

**mangione1** · 12-09-2006, 13:45

Aiutatemi per cortesia:voglio imparare a creare file .css
Dunque dovrei avere una pagina fatta cosi':

una immagine di sfondo ripetuta in centro......(gia' fatto)
una intestazione dove mettere un' altra immagine....
un corpo diviso in 3 colonne........lasciando pero' lo sfondo del body....
un secondo corpo diviso in due colonne.......(ovviamente sotto al primo)
un pie' di pagina.....

CHiedo troppo???
mi aiutereste con la stesura...!????

Magari mi spiegate anche i passaggi....!!!
So che per voi e' una stupidata...e ci vuole poco tempo.......; ma io ho qualche nozione.....molto confusa.......e non riesco ad applicare le regole per gestire sti ID del cavolo!!
GRAZIE MILLE!!

**pezzo** · 12-09-2006, 14:28

:master: dubito che troverai qualcuno che sia disposto a scriverti completamente il codice...

Studiati le guide e gli esempi (ad es. parti da qui), poi fai delle prove e a quel punto se non riesci saremo lieti di aiuti 'codice alla mano'...

PS:
Edito: dal post che segue mi è venuto il dubbio che la mia risposta sembri scortese... ti stavo solo invitando a fare delle prove tu stessa per impadronirti del nuovo metodo che dovrai applicare per creare le tue pagine web. In ogni caso massima disponibilità all'aiuto!

**salasir** · 12-09-2006, 14:39

Ciao.
Dunque, per aiutarti non credo che esistano problemi da parte di nessuno (tempo a parte).

Prima qualche domanda. Hai già letto/studiato le guide sui CSS di questo sito?

Guida CSS di base
Guida Layout dei siti con i CSS

Poi dai un'occhiata ad alcuni esempi già preconfezionati:
Layout Gala.

Se non l'hai ancora fatto, è meglio iniziare da lì perchè se ti mancano le basi, è difficile spiegare. Inoltre se te lo fa un altro ti rimane ben poco.

Ancora una cosa. Se ti accosti per la prima volta ai CSS e hai già provato a fare siti con il vecchio metodo tradizionale (font, align=center, ...), è meglio che ti predisponga a modificare il tuo approccio mentale. Separare i contenuti della pagina dalla presentazione. Prima si imposta il contenuto utilizzando per ogni parte il giusto tag, poi si passa a dare una forma grafica al tutto tramite i CSS.

Leggi anche questo:
La nuova filosofia di progettazione web

Se ti ho detto cose che sai già, scusa, ma non conosco il tuo livello.

**mangione1** · 13-09-2006, 07:55

Ok.....e' vero , avete ragione.......!!!
Dunque oggi inoltro qualcosa..........e magari mi dite se quello che voglio fare e' corretto(piu' che altro mettero' di fianco alle varie parti....le spiegazioni cosi' mi dite , per cortesia, se ho capito i vari passaggi!)
Grazie!!!!!!

**mangione1** · 13-09-2006, 08:22

Anzi lo faccio subito.....!hih hi hi hi!!!Illavoro puo' aspettare!!!

Pagina HTML:

<body>
<div id="container"> <-- contenitore principale: contiente tutte le parti della mia pagina web.Qui imposto le dimesioni che deve avere rispetto alla pagina web-->

<div id="header"></div><-- parte alta del documento: la voglio lasciare larga come tutto il container:ci mettero' una immagine fatta da me-->

<div id="navigation"></div><--colonna menu di navigazione:-->
<div id="content"></div><--contenuto delle pagine del sito:dove si vedra' il contenuto che cambia delle varie pagine-->
<div id="footer"></div><--pie' di pagina

vviamente in fodn pagina...lunga come tutto il container-->
</div>
</body>

Ora passo al css.

%/corpo pagina web:imposto sfondo che si ripete al centro in verticale%/

body {
background: url('sfondo.gif');repeat-y;top center;
}

%/contenitore principale :imposto dimensioni di tutto il corpo della pagina%/

div#container{
width: 750px;
heigth: 600px;
}

%/parte alta :imposto sfondo (con immagine fissa) e dimensioni %/

div#header{
background: url('header.gif') ;no-repeat;top center;
width: 750px;
heigth: 100px
}

%/colonna navigazione :imposto il float a dx (cosi mi mette la colonna a dx) e imposto la larghezza px %/

div#navigation{
float: right;
width: 750px
}

%/contenuto :imposto quanto la pagina verra' nascosta dalla colonna navigation(con il float)%/

div#content{
margin-right: 150px;
}

%/pie' di pagina :imposto che a dx il pie' di pagina non deve avere il menu' navigazione sopra di essa%/

div#footer{
clear: right
}

Che dite?
non ho ancora provato.....sono al lavoro......
Per gli stili del testo ....faremo...piu' avanti
Piu' che altro......e: e' giusto impostare l' immagine di sfondo dell' Header...cosi??
GRAZIE MILLE! fra mezz' ora torno!!!

**salasir** · 13-09-2006, 09:07

Due cose:
i commenti, nel CSS, si indicano "/* ... */" non "%/".
il carattere ";" chiude le varie proprietà non divide i valori all'interno delle stesse.

codice:

background: url('header.gif') no-repeat top center;

Per il resto, ... dipende da come vuoi che venga il risultato. Per ora va bene. vediamo in seguito.

**mangione1** · 13-09-2006, 09:37

Si e' vero...cazzarola........
Piu' che altro.........devo abituarmi ....con la punteggiatura........
Una cosa:
mi spiegheresti bene come si usa l' uinita' di misura em?
Va usata come i px.......ho ha dei valori diversi?Cioe' se con i pixel voglio un container che sia width 750 px...... scrivo 750 em....., o e' una unita' di misura che calcola la distanza dal bordo della pagina web?

P.S.
I file.swf di flash si usano tranquillamente inserendoli tra i "<div id> .....</div> " vero? :master:
P.S.
la proprieta' trasparent............praticamente se metto " background :trasparent url( ' header.gif') no -repeat top center;" ed ho gia' una immagine impostata nel "body", mi rende l' immagine dell' header ...trasparente? :master:
Grazie mille.....( sti css mi piacciono gia!)

**salasir** · 13-09-2006, 10:01

Originariamente inviato da mangione1
mi spiegheresti bene come si usa l' uinita' di misura em?
Va usata come i px.......ho ha dei valori diversi?Cioe' se con i pixel voglio un container che sia width 750 px...... scrivo 750 em....., o e' una unita' di misura che calcola la distanza dal bordo della pagina web?

Valori e unità di misura
Dimensionare i caratteri con i CSS
CSS: Pagine zoomabili

I file.swf di flash si usano tranquillamente inserendoli tra i "<div id> .....</div> " vero? :master:

non conosco flash ma credo che si debba utilizzare <object>...</object>

la proprieta' trasparent............praticamente se metto " background :trasparent url( ' header.gif') no -repeat top center;" ed ho gia' una immagine impostata nel "body", mi rende l' immagine dell' header ...trasparente? :master:
Grazie mille.....( sti css mi piacciono gia!)

No. transparent indica il colore da attribuire al div "header" in mancanza o come sfondo dell'immagine indicata nell'url. Se l'immagine è stata creata con effetto trasparenza e sotto c'è un'altra immagine, credo (mo non l'ho mai usato) che tu veda le due immagini sovrapposte

**andrea.paiola** · 13-09-2006, 16:20

mangione1, al di là di tutto, dovresti scegliere innanzitutto il tipo di documento e quindi inserire la relativa dichiarazione... insomma prima di arrivare ai CSS bisogna avere un documento (X)HTML fatto come si deve

ah e metti il codice dentro il tag apposito quando lo inserisci sul forum

**mangione1** · 14-09-2006, 08:03

Questo e' nuovo sito ...e quindi volevo partire dai css......
Ho gia' in mente cosa e come fare...... e che voglio passo passo comprendere bene i css(almeno i processi di base per creare layout e sfondi ...).
I layout sono ok.

Ora ho un altro problema:
perche' se cerco di impostare come "background:url('image.jpeg') no-repeat;" di un div come ad esempio l' header.......non mi carica l' immagine?
I percorsi sono corretti......non capisco....
Se imposto invece un colore di sfondo me lo fa vedere.......
(preciso che ho impostato una immagine di sfondo del body.........che si ripete in verticale al centro......)..: non dovrebbe sovrapporsi l' immagine dell' header.....,in questo caso, a quella dello sfondo del body?
Grazie ancora per la pazienza.................

Discussione: Primo File.css

Strumenti discussione

Ricerca discussione

Visualizza

Aiuto Primo File.css

Permessi di invio