|
Home -> Manuali e Tutorials -> Guida CSS -> Bordi e Riempimento (1/3)
Scarica il tutorial | Stampa il tutorial | Cerca nel sito
IMPOSTARE I BORDI CON I CSS
I fogli di stile permettono di formattare il testo senza dover ricorrere a tabelle, creando degli elementi visualizzati all'interno di un'area. Ogni area possiede elementi che si possono suddividere in tre categorie:
- i margini che costituiscono il bordo esterno all'area;
- il riempimento che costituisce lo spazio interno all'area che separa il contenuto dal bordo;
- i bordi che costituiscono l'aspetto grafico attorno all'area.

La larghezza di tutti gli elementi che compongono margini, bordi e riempimento può essere espressa in valore assoluto o in percentuale.
I valori assoluti ammessi sono:
- px (pixels)
- cm (centimetri)
- mm (millimetri)
- pt (punti)
- pc (pica equivalenti a 12 punti)
- em (unità)
Non ha nessuna importanza l'uso dell'uno o dell'altro valore, adopera quello con il quale ti trovi meglio. Il valore percentuale è espresso con un numero seguito dal segno %.

La figura di sopra mostra come vari il codice di stile a seconda se ci si riferisca al bordo, al riempimento ( padding ) o ai margini.
I margini dal bordo pagina
Il margine è lo spazio fisico che separa la parte dedicata alle scritte ed alle immagini dal bordo del foglio, sia da destra che da sinistra, sia dall'alto che dal basso.
I nomi ammessi degli elementi sono:
- margin-top (margine dall'alto)
- margin-right (margine da destra)
- margin-left (margine da sinistra)
- margin-bottom (margine dal basso)
Nell'esempio che segue abbiamo supposto che si desideri che lo scritto nella pagina sia distante 100 pixels dall'alto, 150 da sinistra e 50 da destra. Ovviamente abbiamo in realtà scritto il testo esattamente nell'angolo superiore sinistro del foglio.
Ecco l'esempio:
<head>
<style type = "text/css">
p { margin-top:100px; margin-left:150px; margin-right: 50px }
</style>
</head>
<body>
<P>Questo testo è stato scritto nell'angolo superiore sinistro della pagina senza mai andare a capo, ma, grazie al foglio di stile, appare distante 100 pixels dal bordo superiore, 150 pixels dal lato sinistro e 50 pixels dal lato destro della pagina. </P>
</body>
|
Torna su | Indice Guida | Pagina << 12 >>
|