|
| Precedente :: Successivo |
| Autore |
Messaggio |
Albatro
Eroe in grazia degli dei
Registrato: 22/03/06 06:56
Messaggi: 163
Residenza: Roma
|
 Inviato: 22 Ago 2006 21:57 Oggetto: |
 |
|
| rebelia ha scritto: | non dovrebbe 
per cortesia postami il codice della pagina e quello del css tra i tag [ code] [/ code ] che do un'occhiata  |
html
--------------------------------------------------
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="it">
<head>
<title>chatline</title>
<meta name="keywords" content=" " />
<meta name="description" content=" " />
<link href="stile.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="contenitore">
<div id="alto">
<div id="header">
<h1></h1>
<a href="#" title="banners"><img src="banner400x4014.gif" /></a>
</div>
<hr />
<div id="menu">
<ul>
<li><a href="#">Entra in chat</a></li>
<li><a href="#">Il tuo Link</a></li>
<li><a href="#">Chi sono</a></li>
<li><a href="#">E-mail</a></li>
<li><a href="#">I banners</a></li>
<li><a href="#">Le foto</a></li>
</ul>
</div>
</div>
<hr />
<div id="contenuto">
[contenuti]
</div>
<hr />
<div id="footer">
</div>
</div>
<p> </p>
</body>
</html>
-----------------------------------------------
css
body {
background: #fff;
color: black;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 80%;
border: 0px;
margin: 0px;
padding: 0px;
}
hr, h1 {
display: none;
}
img {
border: 0px;
}
#contenitore {
}
#alto {
background: #999;
border-bottom: 3px solid #000;
padding-bottom: 7px;
}
#header {
height: 150px;
background: #669999 url(logo.gif) no-repeat top left;
text-align: right;
padding-right: 10px:
padding-top: 50px;
}
#header img {
margin-right: 10px;
margin-bottom: 50px;
}
#menu {
padding: 10px;
border-bottom: 3px solid #000;
background: #c0c0c0;
}
#menu ul {
list style: none;
margin: 0px;
padding: 0px;
}
#menu ul li {
display: inline;
margin: 0px;
padding: 0px;
}
#menu ul li a {
text-decoration: none;
padding: 5px 10px 5px 10px;
color: #000;
}
#menu ul li a:hover {
color: #ac6100;
}
#contenuto {
padding: 10px;
text-align: left;
}
UNICA immagine usata:
ok,le palpebre me calano 
notte notte |
|
| Top |
|
 |
rebelia
Dio maturo
Registrato: 17/07/03 09:22
Messaggi: 7987
|
| Inviato: 22 Ago 2006 22:16 Oggetto: |
|
|
un errore nel codice e uno (colpa mia!) nel css
togli il <p>&nb sp;</p> da qui:
html:
| Codice: |
</div>
<p> </p> <-- questo qui (lo trovi a fondo pagina)
</body>
</html>
|
e sostituisci i due punti dopo il padding-right con un puntoevirgola qui:
css:
| Codice: |
#header {
height: 150px;
background: #669999 url(logo.gif) no-repeat top left;
text-align: right;
padding-right: 10px; <--- in questo punto!
padding-top: 50px;
}
|
in alto e' un errore determinato probabilmente dall'aver aperto il file con un editor visuale, il secondo e' piu' grave ed e' un errore mio: il puntoevirgola "chiude" il comando, mentre i due punti no e rendono inefficace il comando a cui sono applicati e invisibili quelli dopo, fino alla chiusura della parentesi graffa
sistema queste due cose e il tuo banner dovrebbe scollarsi da li'; poi regoli le distanze agendo sui 10 pixel e sui 50 pixel
quando hai fatto, ci aggiorniamo e mi dici qual'e' il passaggio successivo
ciao |
|
| Top |
|
|
Albatro
Eroe in grazia degli dei
Registrato: 22/03/06 06:56
Messaggi: 163
Residenza: Roma
|
| Inviato: 23 Ago 2006 04:31 Oggetto: |
|
|
| rebelia ha scritto: | un errore nel codice e uno (colpa mia!) nel css
togli il <p>&nb sp;</p> da qui:
html:
| Codice: |
</div>
<p> </p> <-- questo qui (lo trovi a fondo pagina)
</body>
</html>
|
e sostituisci i due punti dopo il padding-right con un puntoevirgola qui:
css:
| Codice: |
#header {
height: 150px;
background: #669999 url(logo.gif) no-repeat top left;
text-align: right;
padding-right: 10px; <--- in questo punto!
padding-top: 50px;
}
|
in alto e' un errore determinato probabilmente dall'aver aperto il file con un editor visuale, il secondo e' piu' grave ed e' un errore mio: il puntoevirgola "chiude" il comando, mentre i due punti no e rendono inefficace il comando a cui sono applicati e invisibili quelli dopo, fino alla chiusura della parentesi graffa
sistema queste due cose e il tuo banner dovrebbe scollarsi da li'; poi regoli le distanze agendo sui 10 pixel e sui 50 pixel
quando hai fatto, ci aggiorniamo e mi dici qual'e' il passaggio successivo
ciao |
-----------------------------------------------------------------------------
b giorno,considerando che ho gli occhi ancora chiusi,vediamo se ho capito bene:
ho tolto questa righa dal codice html completamente:
<p> </p>
infatti va bene
Domanda: ora il logo sta messo in una cartella sparso insieme
ad altri files,ma se io per tenere in ordine il tutto volessi
fargli una cartella tutta sua,( con frontpage non avevo problemi la ricercavo e aggiungevo il link ipertestuale) dove devo intervenire?
sul css su questa porzione di codice?
#header {
height: 150px;
background: #669999 url(logo.gif) no-repeat top left;
text-align: right;
padding-right: 10px;
padding-top: 45px;
}
e come?
felice giornata  |
|
| Top |
|
|
rebelia
Dio maturo
Registrato: 17/07/03 09:22
Messaggi: 7987
|
| Inviato: 23 Ago 2006 09:13 Oggetto: |
|
|
| Codice: |
background: #669999 url(immagini/logo.gif) no-repeat top left;
|
disgressione: quando posti pezzi di codice nel thread, fallo tra i tag [ code] in apertura e [/ code] in chiusura per cortesia
(senza lo spazio che ci ho messo io prima della lettera c)
|
|
| Top |
|
|
Albatro
Eroe in grazia degli dei
Registrato: 22/03/06 06:56
Messaggi: 163
Residenza: Roma
|
| Inviato: 23 Ago 2006 20:49 Oggetto: |
|
|
| rebelia ha scritto: | | Codice: |
background: #669999 url(immagini/logo.gif) no-repeat top left;
|
disgressione: quando posti pezzi di codice nel thread, fallo tra i tag [ code] in apertura e [/ code] in chiusura per cortesia
(senza lo spazio che ci ho messo io prima della lettera c)
|
ok capo
e per il banner come devo fare?.......grazie
html
| Codice: | | <a href="#" title="banners"><img src="banner.gif"/></a> |
che ne pensi?
[img] http://img183.imageshack.us/my.php?image=topvf1.jpg [/img] |
|
| Top |
|
|
rebelia
Dio maturo
Registrato: 17/07/03 09:22
Messaggi: 7987
|
| Inviato: 23 Ago 2006 21:02 Oggetto: |
|
|
| Albatro ha scritto: |
e per il banner come devo fare?.......grazie |
ehm... a far cosa!?
lo sposti come preferisci modificando i valori di padding dati all'header; se ti pare il caso, visto che stiamo parlando di un layout fluido, padding-right puoi esprimerlo in percentuale: padding-right: 10% al posto dell'attuale padding-right: 10px;
scusa, ma non capisco dove vuoi spostare il banner 
piuttosto se il banner e' cosi' piccolo e l'intestazione anche, e' meglio che tu stringa l'header: al momento c'e' troppo spazio libero, imho |
|
| Top |
|
|
Albatro
Eroe in grazia degli dei
Registrato: 22/03/06 06:56
Messaggi: 163
Residenza: Roma
|
| Inviato: 23 Ago 2006 23:12 Oggetto: |
|
|
| rebelia ha scritto: | | Albatro ha scritto: |
e per il banner come devo fare?.......grazie |
ehm... a far cosa!?
lo sposti come preferisci modificando i valori di padding dati all'header; se ti pare il caso, visto che stiamo parlando di un layout fluido, padding-right puoi esprimerlo in percentuale: padding-right: 10% al posto dell'attuale padding-right: 10px;
scusa, ma non capisco dove vuoi spostare il banner
piuttosto se il banner e' cosi' piccolo e l'intestazione anche, e' meglio che tu stringa l'header: al momento c'e' troppo spazio libero, imho |
quello che volevo dire,mi hai insegnato come era il modo giusto per dare il percorso al logo,stando in una cartella,ora ti avevo chiesto, come si fa per farlo anche al banner?
css
| Codice: | #header {
height: 150px;
background: #9999ff url(logo sito/logo.gif) no-repeat top left;
text-align: right; |
html
| Codice: | <div id="alto">
<div id="header">
<h1></h1>
<a href="#" title="banners"><img src="banner.gif"/></a>
|
notte notte |
|
| Top |
|
|
rebelia
Dio maturo
Registrato: 17/07/03 09:22
Messaggi: 7987
|
| Inviato: 23 Ago 2006 23:36 Oggetto: |
|
|
| Albatro ha scritto: |
html
| Codice: | <div id="alto">
<div id="header">
<h1></h1>
<a href="#" title="banners"><img src="banner.gif"/></a>
|
|
no, non puoi mettere DUE background in un div: o integri il banner nell'header, oppure - ed e' la cosa migliore! - lo lasci li' dov'e', altrimenti non potresti neanche linkarlo oppure sostituirlo velocemente con un altro
lascia li' il banner e passiamo al punto successivo: ora che vuoi fare al tuo sito? |
|
| Top |
|
|
Albatro
Eroe in grazia degli dei
Registrato: 22/03/06 06:56
Messaggi: 163
Residenza: Roma
|
| Inviato: 24 Ago 2006 06:03 Oggetto: |
|
|
b giorno, | Codice: | | no, non puoi mettere DUE background in un div: o integri il banner nell'header |
forse mi sono spiegato male,io non voglio raddoppiare nulla,avevo chiesto
a puro titolo sopratutto di curiosita'se potevo indirizzare il banner che ho messo anziche' stare in mezzo agli altri files,se si poteva fargli una cartella sua,come del resto ho gia nell'altro sito una cartella in cui contiene tutti i banner,le immagini etc..con il logo e' stato fatto pensavo che anche col banner si potesse fare
Tornando al resto
l'header infatti mi sembrava un po troppo alto 150,cosi l'ho abbassato a 120,spero non porti nessun scompenso al layout,per le due fasce laterali e il footer avrei intenzione si di metterle ma,sempre con lo stesso colore del background dell pagina (bianco) in modo che vedo solo io la delimitiazione del layout,ma non l'utente,e poi i Link sia a destra che sinistra e la parte centrale tipo questo:
poi ovviamente gli abbinamenti dei colori si possono sempre cambiare
qui e' solo indicativo:
[img] http://img180.imageshack.us/my.php?image=layoutvv9.gif [/img]
b.giornata e sempre grazie  |
|
| Top |
|
|
rebelia
Dio maturo
Registrato: 17/07/03 09:22
Messaggi: 7987
|
| Inviato: 24 Ago 2006 08:03 Oggetto: |
|
|
| Albatro ha scritto: |
forse mi sono spiegato male,io non voglio raddoppiare nulla,avevo chiesto
a puro titolo sopratutto di curiosita'se potevo indirizzare il banner che ho messo anziche' stare in mezzo agli altri files,se si poteva fargli una cartella sua,come del resto ho gia nell'altro sito una cartella in cui contiene tutti i banner,le immagini etc..con il logo e' stato fatto pensavo che anche col banner si potesse fare |
ops... scusa, ho preso una cantonata
si, si puo' fare:
| Codice: |
<a href="#" title="banners"><img src="immagini/banner.gif"/></a>
|
l'importante e' che tu cambi sempre i percorsi; in questo caso quello nel codice html
| Citazione: |
Tornando al resto
l'header infatti mi sembrava un po troppo alto 150,cosi l'ho abbassato a 120,spero non porti nessun scompenso al layout |
no, assolutamente; ti e' sufficiente variare il relativo valore nel css alla voce #header - height e ci metti il nuovo valore
al resto ti rispondo dopo, che ora m'aspettano  |
|
| Top |
|
|
Albatro
Eroe in grazia degli dei
Registrato: 22/03/06 06:56
Messaggi: 163
Residenza: Roma
|
| Inviato: 24 Ago 2006 13:37 Oggetto: |
|
|
| Codice: | Codice:
<a href="#" title="banners"><img src="immagini/banner.gif"/></a>
l'importante e' che tu cambi sempre i percorsi; in questo caso quello nel codice html
|
infatti ora e' tutto ok,il banner lo legge dalla sua direttori dove in seguito andranno anche tutti gli altri banner.A tal proposito,quando dovro' aggiungere altri banner su altre pagine del sito dovro' mettere sempre un link di questi ma cambiando il percorso vero?
l'importante e' che tu cambi sempre i percorsi; in questo caso quello nel codice html |
|
| Top |
|
|
rebelia
Dio maturo
Registrato: 17/07/03 09:22
Messaggi: 7987
|
| Inviato: 24 Ago 2006 14:36 Oggetto: |
|
|
| Albatro ha scritto: |
infatti ora e' tutto ok,il banner lo legge dalla sua direttori dove in seguito andranno anche tutti gli altri banner.A tal proposito,quando dovro' aggiungere altri banner su altre pagine del sito dovro' mettere sempre un link di questi ma cambiando il percorso vero? |
piccola lezione sui percorsi:
generalmente hai una directory principale dove stanno tutti i tuoi files
questa directory contiene delle sottodirectory, ad esempio "immagini" oppure "banners" come nel tuo caso
se le pagine stanno tutte in "directory principale", il percorso da seguire sara' nome_directory/nome_file (es. immagini/logo.gif)
se le pagine fossero anch'esse in una sottodirectory (mettiamo "pagine") sarebbe necessario *risalire* di una directory prima di *ridiscendere* nella directory che contiene il file che intendiamo linkare
esempio pratico: poniamo che i nostri files siano dislocati in questo modo:
| Codice: |
directory_principale
index.html
pagine
prodotti.html
contatti.html
immagini
logo.gif
panoramica.jpg
|
ho una directory principale che contiene:
un file che si chiama index.html
una directory (cartella) che si chiama pagine e che contiene dei files
un'altra directory che si chiama immagini e che contiene anch'essa dei files
poniamo che io voglia linkare logo.gif nella pagina index.html; il codice della pagina index.html sara' questo:
| Codice: |
<img src="immagini/logo.gif" />
|
poniamo invece che io voglia linkare alla pagina index.html una delle altre due pagine:
| Codice: |
bla bla bla <a href="pagine/contatti.html">bla</a> bla bla bla
|
se volessi fare il contrario, cioe' da contatti.html linkare index.html (sempre piu' difficile  ), scriverei:
| Codice: |
bla bla bla <a href="../index.html">bla</a> bla bla bla
|
ora invece voglio linkare l'immagine panoramica.jpg nella pagina contatti.html; apro la pagina contatti e scrivo:
| Codice: |
<img src="../immagini/panoramica.jpg" />
|
cioe' dico al browser di risalire un gradino prima di cercare direttamente la pagina nel primo caso e la directory immagini nel secondo
../ funziona all'infinito; se avessi dovuto risalire DUE gradini, avrei scritto ../../immagini/panoramica.jpg e questa cosa funziona uguale nel css
e' molto frequente che i problemi di visualizzazione delle pagine siano dovuti a percorsi (immagini/panoramica.jpg al posto di foto/panoramica.jpg, ad esempio) o a estensioni errate (scrivere logo.gif anziche' logo.jpg)
le colonne spero di riuscire a preparartele stasera |
|
| Top |
|
|
Albatro
Eroe in grazia degli dei
Registrato: 22/03/06 06:56
Messaggi: 163
Residenza: Roma
|
| Inviato: 24 Ago 2006 20:13 Oggetto: |
|
|
ok capo ho recepito la tua lezione e l'ho salvata come file,sai na cosa e' qualche anno che uso frontpage e lo conosco molto bene,ma non ti insegna nulla,quindi e' logico che quando devo dare delle istruzioni manualmente allo script sono in difficolta'
Per le colonne non c'e problema,quando puoi dedicartici lo farai,immagino che anche tu avrai da fare,ti ho gia tanto disturbata: |
|
| Top |
|
|
rebelia
Dio maturo
Registrato: 17/07/03 09:22
Messaggi: 7987
|
| Inviato: 26 Ago 2006 23:30 Oggetto: |
|
|
eccomi qua! ho calcolato male i tempi, ma finalmente son tornata
ok, partiamo da questo pezzo di codice:
| Codice: |
<div id="contenuto">
[contenuto]
</div>
|
e da questo pezzo di css qua:
| Codice: |
#contenuto {
padding: 10px;
text-align: left;
}
|
per inserire "fisicamente" le tre colonne, dobbiamo aggiungere tre div all'interno di #contenuto in questo modo:
| Codice: |
<div id="contenuto">
<div id="uno"></div>
<hr />
<div id="due"></div>
<hr />
<div id="tre"></div>
</div>
|
e siccome senza contenuto si lavora male, li riempio con del testo a caso in questo modo, cosi' quando lo copieincolli vedi subito il risultato:
| Codice: |
<div id="contenuto">
<div id="uno">
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc
accumsan tellus sed metus. In vehicula. Cras eleifend adipiscing
justo. Proin posuere, purus eget placerat rutrum, lorem augue
iaculis tortor, nec aliquam erat quam eget mi. Vivamus convallis
euismod augue. Sed euismod mauris nec urna. Nullam nonummy.
Sed sollicitudin ipsum ut magna suscipit pretium. Proin nec tortor.
Mauris nibh tellus, volutpat sit amet, scelerisque vitae, convallis
ornare, arcu. Ut justo turpis, tempor id, convallis eget, lacinia
posuere, justo. Curabitur porta, ligula imperdiet consectetuer
adipiscing, nisi dui convallis velit, eget sagittis erat lorem id nisl.
Morbi sapien leo, suscipit eu, convallis id, gravida eget, felis.
Aliquam volutpat eros et quam. Nunc quis sem congue mi semper
interdum. Integer pellentesque lorem. Vivamus purus dui, suscipit
eu, fringilla eu, dapibus id, tortor. Pellentesque venenatis, diam quis
accumsan varius, velit odio aliquam purus, eu nonummy sem nulla
sed leo.
</p>
</div>
<hr />
<div id="due">
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc
accumsan tellus sed metus. In vehicula. Cras eleifend adipiscing
justo. Proin posuere, purus eget placerat rutrum, lorem augue
iaculis tortor, nec aliquam erat quam eget mi. Vivamus convallis
euismod augue. Sed euismod mauris nec urna. Nullam nonummy.
Sed sollicitudin ipsum ut magna suscipit pretium. Proin nec tortor.
Mauris nibh tellus, volutpat sit amet, scelerisque vitae, convallis
ornare, arcu. Ut justo turpis, tempor id, convallis eget, lacinia
posuere, justo. Curabitur porta, ligula imperdiet consectetuer
adipiscing, nisi dui convallis velit, eget sagittis erat lorem id nisl.
Morbi sapien leo, suscipit eu, convallis id, gravida eget, felis.
Aliquam volutpat eros et quam. Nunc quis sem congue mi semper
interdum. Integer pellentesque lorem. Vivamus purus dui, suscipit
eu, fringilla eu, dapibus id, tortor. Pellentesque venenatis, diam quis
accumsan varius, velit odio aliquam purus, eu nonummy sem nulla
sed leo.
</p>
</div>
<hr />
<div id="tre">
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc
accumsan tellus sed metus. In vehicula. Cras eleifend adipiscing
justo. Proin posuere, purus eget placerat rutrum, lorem augue
iaculis tortor, nec aliquam erat quam eget mi. Vivamus convallis
euismod augue. Sed euismod mauris nec urna. Nullam nonummy.
Sed sollicitudin ipsum ut magna suscipit pretium. Proin nec tortor.
Mauris nibh tellus, volutpat sit amet, scelerisque vitae, convallis
ornare, arcu. Ut justo turpis, tempor id, convallis eget, lacinia
posuere, justo. Curabitur porta, ligula imperdiet consectetuer
adipiscing, nisi dui convallis velit, eget sagittis erat lorem id nisl.
Morbi sapien leo, suscipit eu, convallis id, gravida eget, felis.
Aliquam volutpat eros et quam. Nunc quis sem congue mi semper
interdum. Integer pellentesque lorem. Vivamus purus dui, suscipit
eu, fringilla eu, dapibus id, tortor. Pellentesque venenatis, diam quis
accumsan varius, velit odio aliquam purus, eu nonummy sem nulla
sed leo.
</p>
</div>
</div>
|
e ora la presentazione:
| Codice: |
#contenuto {
text-align: left;
}
#uno {
width: 25%;
float: left;
background: #c0c0c0;
padding: 1%;
}
#due {
width: 40%;
float: left;
margin-left: 2%;
padding: 1%;
}
#tre {
width: 25%;
float: right;
background: #c0c0c0;
padding: 1%;
}
|
non ti spaventare, te la commento
| Codice: |
#contenuto {
text-align: left;
}
|
tolgo il padding al contenuto, in modo che i div interni vadano ad appoggiarsi al bordo (ricordo che il padding e' lo spazio tra il bordo e il contenuto)
| Codice: |
#uno {
width: 25%;
float: left;
background: #c0c0c0;
padding: 1%;
}
|
essendo un layout fluido, esprimo le larghezze in percentuale; a questo la imposto al 25%
lo faccio fluttuare (traduzione creativa  ) a sinistra
imposto uno sfondo grigio chiaro
e metto un padding qua dentro, in questo modo il contenuto non sara' appiccicato al bordo del div
| Codice: |
#due {
width: 43%;
float: left;
padding: 1%;
}
|
larghezza 43%
float a sinistra (si va ad appoggiare all'altro, in pratica)
anche qui imposto un po' di padding
| Codice: |
#tre {
width: 25%;
float: right;
background: #c0c0c0;
padding: 1%;
}
|
larghezza 25%
questo lo faccio fluttuare a destra, cosi' s'appoggia al lato destro come #uno si appoggia al lato sinistro
sfondo grigio chiaro
padding 1% anche a questo
nota la somma totale *non e'* 100%, ma 99% perche' il comando float non permette di usufruire in toto dello spazio a disposizione; nel caso ci si accorgesse che uno dei div finisce sotto all'altro, il problema normalmente sta proprio qui ed e' sufficiente ritarare le misure e le proporzioni per risolvere il problema
il float modifica il normale flusso del codice, quindi una volta sistemati degli elementi con il float, e' necessario ripristinare il normale flusso del codice; normalmente e' sufficiente applicare il comando clear: both; al primo elemento blocco che si trova dopo i div flottanti, ma per correggere un baco di firefox e' necessario agire in modo leggermente diverso e cioe' inserire un elemento - io uso un div - *all'interno* del div #contenitore in questo modo (uso il codice con i div vuoti per non postare troppa roba inutile):
| Codice: |
<div id="contenuto">
<div id="uno"></div>
<hr />
<div id="due"></div>
<hr />
<div id="tre"></div>
<div class="chiudi_float"></div>
</div>
|
al div non imposto un id, ma una classe; questo perche' in una pagina potrei aver bisogno di piu' div flottanti e di conseguenza di piu' div di chiusura ed una classe e' quel che fa per me (ricordo che in una pagina gli id devono essere univoci, mentre si possono avere piu' elementi con la stessa classe
nel css aggiungo:
| Codice: |
.chiudi_float {clear: both;}
|
cosi' come il cancelletto [ # ] identifica gli id, il punto [ . ] identifica la classe
una disgressione per spiegare il baco di firefox: nell'immagine piu' in alto si vede cosa succede al div contenitore se non inserisco un elemento che ripristini il flusso del codice e nell'immagine piu' sotto si vede invece come lavora il div contenitore se l'elemento c'e' (nel nostro caso il div class="chiudi_float"):
 |
|
| Top |
|
|
Albatro
Eroe in grazia degli dei
Registrato: 22/03/06 06:56
Messaggi: 163
Residenza: Roma
|
| Inviato: 27 Ago 2006 09:43 Oggetto: |
|
|
| Codice: | non ti spaventare, te la commento
|
io non e' che mi spavento.ma vado direttamente al manicomio
io ho fatto cosi': ma solo per una colonna,giusto per vedere se sto facendo bene,invece non vedo nulla e questo mi preoccupa 
| Codice: | #contenuto {
#uno {
width: 25%;
float: left;
background: #c0c0c0;
padding: 1%;
}
text-align: left;
<div id="contenuto">
<div id="uno"></div>
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc
accumsan tellus sed metus. In vehicula. Cras eleifend adipiscing
justo. Proin posuere, purus eget placerat rutrum, lorem augue
iaculis tortor, nec aliquam erat quam eget mi. Vivamus convallis
euismod augue. Sed euismod mauris nec urna. Nullam nonummy.
Sed sollicitudin ipsum ut magna suscipit pretium. Proin nec tortor.
Mauris nibh tellus, volutpat sit amet, scelerisque vitae, convallis
ornare, arcu. Ut justo turpis, tempor id, convallis eget, lacinia
posuere, justo. Curabitur porta, ligula imperdiet consectetuer
adipiscing, nisi dui convallis velit, eget sagittis erat lorem id nisl.
Morbi sapien leo, suscipit eu, convallis id, gravida eget, felis.
Aliquam volutpat eros et quam. Nunc quis sem congue mi semper
interdum. Integer pellentesque lorem. Vivamus purus dui, suscipit
eu, fringilla eu, dapibus id, tortor. Pellentesque venenatis, diam quis
accumsan varius, velit odio aliquam purus, eu nonummy sem nulla
sed leo.
</p>
<hr />
<div id="due"></div>
<hr />
<div id="tre"></div>
</div> |
|
|
| Top |
|
|
rebelia
Dio maturo
Registrato: 17/07/03 09:22
Messaggi: 7987
|
| Inviato: 27 Ago 2006 10:04 Oggetto: |
|
|
| Albatro ha scritto: |
io non e' che mi spavento.ma vado direttamente al manicomio
io ho fatto cosi': ma solo per una colonna,giusto per vedere se sto facendo bene,invece non vedo nulla e questo mi preoccupa |
eh, ma devi seguire le istruzioni pero'
la prima parte del codice va nel file stile.css SOTTO a #contenitore, non all'interno di esso come sembra leggendo quel che hai postato:
| Codice: | #contenuto {
#uno {
width: 25%;
float: left;
background: #c0c0c0;
padding: 1%;
}
text-align: left;
|
i css sono una gran cosa, ma richiedono molta attenzione nello scrivere il codice; un semplice puntoevirgola omesso puo' comprometterne un pezzo piu' o meno grande, quindi in caso di problemi la prima cosa da fare e' controllare la sintassi
e questa parte qua va nel template e va a sostituire il precedente <div id="contenuto">[contenuto]</div>
| Codice: |
<div id="contenuto">
<div id="uno"></div>
<p>
[cut]
</p>
<hr />
<div id="due"></div>
<hr />
<div id="tre"></div>
</div> |
se hai seguito le mie direttive DEVE tornare e anche se hai seguito correttamente quel che hai scritto tu [cioe' riempire solo una colonna] deve tornare; ho appena fatto la prova e questo e' il risultato [lascia stare che ho ancora la grafica vecchia, guarda solo le colonne]:
il risultato con tutte e tre le colonne inserite invece e' questo:
 |
|
| Top |
|
|
Albatro
Eroe in grazia degli dei
Registrato: 22/03/06 06:56
Messaggi: 163
Residenza: Roma
|
| Inviato: 27 Ago 2006 16:13 Oggetto: |
|
|
cu cu'
questo e' come e' venuto:
[/img] http://img243.imageshack.us/my.php?image=layoutfh6.jpg [img][/img]
ora per il footer come posso fare?...merci |
|
| Top |
|
|
Albatro
Eroe in grazia degli dei
Registrato: 22/03/06 06:56
Messaggi: 163
Residenza: Roma
|
| Inviato: 28 Ago 2006 03:08 Oggetto: |
|
|
b giorno,io ho provato a fare questo tipo di link per i menu delle due colonne a mo'di elenco puntato,ma non mi piacciono,se lascio solo il link senza punto quando li vedo sul broweser si posizionano orizzontali:
| Codice: | <li><a href="http://">Link Uno</a></li>
<li><a href="http://">Link Due</a></li>
<li><a href="http://">Link Tre</a></li>
<li><a href="http://">Link Quattro</a></li>
<li><a href="http://">Link Cinque</a></li>
<li><a href="http://">Mappa del sito</a></ |
e poi la lineetta del link rimane fissa io invece vorrei che si vedesse solo al passaggio del mouse,come li ho nell'altro layout come posso farli? |
|
| Top |
|
|
rebelia
Dio maturo
Registrato: 17/07/03 09:22
Messaggi: 7987
|
| Inviato: 28 Ago 2006 09:44 Oggetto: |
|
|
il tuo codice e' questo:
| Codice: |
<div id="uno">
<ul>
<li><a href="http://">Link Uno</a></li>
<li><a href="http://">Link Due</a></li>
<li><a href="http://">Link Tre</a></li>
<li><a href="http://">Link Quattro</a></li>
<li><a href="http://">Link Cinque</a></li>
<li><a href="http://">Mappa del sito</a></li>
</ul>
</div>
|
il tuo css questo:
| Codice: |
#uno ul {
list-style: none;
margin: 0px;
padding: 0px;
}
#uno ul li {
margin: 0px;
padding: 0px;
}
#uno ul li a {
text-decoration: none;
}
#uno ul li a:hover {
text-decoration: underline;
}
|
commentato:
| Codice: |
#uno ul {
list-style: none;
margin: 0px;
padding: 0px;
}
|
nessun tipo di punto elenco
nessun margine (spazio tra il bordo e l'elemento successivo)
nessun padding (spazio tra il bordo e il contenuto)
| Codice: |
#uno ul li {
margin: 0px;
padding: 0px;
}
|
nessun margine
nessun padding
queste due dichiarazioni, cosi' come quelle uguali del blocco sopra, servono perche' a volte nei browser non e' sufficiente dare list-style: none per eliminare il punto elenco (baco dei browser)
| Codice: |
#uno ul li a {
text-decoration: none;
}
|
nessuna sottolineatura al link
| Codice: |
#uno ul li a:hover {
text-decoration: underline;
}
|
sottolineatura al link "sfiorato"
per il footer, fammi lo schizzo di come lo vorresti ed io te lo traduco in codice |
|
| Top |
|
|
Albatro
Eroe in grazia degli dei
Registrato: 22/03/06 06:56
Messaggi: 163
Residenza: Roma
|
| Inviato: 28 Ago 2006 15:25 Oggetto: |
 |
|
| rebelia ha scritto: | il tuo codice e' questo:
| Codice: |
<div id="uno">
<ul>
<li><a href="http://">Link Uno</a></li>
<li><a href="http://">Link Due</a></li>
<li><a href="http://">Link Tre</a></li>
<li><a href="http://">Link Quattro</a></li>
<li><a href="http://">Link Cinque</a></li>
<li><a href="http://">Mappa del sito</a></li>
</ul>
</div>
|
il tuo css questo:
| Codice: |
#uno ul {
list-style: none;
margin: 0px;
padding: 0px;
}
#uno ul li {
margin: 0px;
padding: 0px;
}
#uno ul li a {
text-decoration: none;
}
#uno ul li a:hover {
text-decoration: underline;
}
|
commentato:
| Codice: |
#uno ul {
list-style: none;
margin: 0px;
padding: 0px;
}
|
nessun tipo di punto elenco
nessun margine (spazio tra il bordo e l'elemento successivo)
nessun padding (spazio tra il bordo e il contenuto)
| Codice: |
#uno ul li {
margin: 0px;
padding: 0px;
}
|
nessun margine
nessun padding
queste due dichiarazioni, cosi' come quelle uguali del blocco sopra, servono perche' a volte nei browser non e' sufficiente dare list-style: none per eliminare il punto elenco (baco dei browser)
| Codice: |
#uno ul li a {
text-decoration: none;
}
|
nessuna sottolineatura al link
| Codice: |
#uno ul li a:hover {
text-decoration: underline;
}
|
sottolineatura al link "sfiorato"
per il footer, fammi lo schizzo di come lo vorresti ed io te lo traduco in codice |
per capire ci metto un po'ma alla fine poi realizzo
visto con le colonne?l'ho rifatto parecchie volte poi alla fine wowwww
per il footer ammeno che' non hai qualcosa tu di particolare da consigliare
per me l'importante e' che posso metterci dei contenuti all'interno,poi per il resto no problem,invece per i link non ho afferrato bene la tua spiegazione....e non mi dire che non ti seguo ..solo che man mano che ti leggo ti perdo,tu sei un fenomeno in materia,io invece.. 
da quello che mi ha spiegato mi par di capire che ho diverse soluzioni,solo che non ho capito se devo aggiungere del codice a quello che gia' ho.
byee |
|
| Top |
|
|
|
|
Non puoi inserire nuovi argomenti
Non puoi rispondere a nessun argomento
Non puoi modificare i tuoi messaggi
Non puoi cancellare i tuoi messaggi
Non puoi votare nei sondaggi
|
|
FAQ
Cerca
Lista utenti
Gruppi
Registrati
Profilo
Messaggi privati
Log in
