Bordi e angoli arrotondati con codice CSS

« Older Newer »

Secret X

Posted on 22/7/2011, 18:49

Group: Admin

Posts: 6,984

Reputation: +38

Status: Anonymous

CODICE

TESTO QUI

CODICE

<div style="background-color:#DD0000; color:#FFFFFF; font-size:10px; font-family:georgia; text-align:left; width:150px; -moz-border-radius: 11px; padding:6px; line-height:8px;">Presentazioni

Presentazioni

Elenco tag HTML utilizzati:

Centrare un'immagine o un testo

CODICE

immagine/testo

per altri tag HTML guarda -> QUI

Attributi di stile del testo:

Gli attributi devono essere inseriti all'interno di parentesi graffe { } e laddove in HTML verrebbe usato un "=" (uguale) nei css viene invece usato ":" (due punti).
Argomenti consecutivi sono separati da un ";" (punto e virgola) invece che dalla "," (virgola). Inoltre molti argomenti sono divisi da "-" (trattino centrale) che fa parte integrante del nome stesso.

Allineamento del testo, valori possibili: centrato=center, sinistra=left, destra=right
text-align: center | left | right
Altezza della riga del testo, valori possibili: normal, numero, lunghezza, percentuale. Con il valore normal il testo non avrà alcuna variazione.
line-height: normal | numero | lunghezza | percentuale
Decorazione del testo, valori possibili: overline= sopralineato, underline= sottolineato, line-through= sbarrato, overline underline= sopra e sottolineato, blink= lampeggiante (non supportato da IE), none= nessuno. E' anche possibile combinarne più di uno, per esempio inserendo sia underline che overline.
text-decoration: overline | underline | line-through | none

Dimensione del testo indica la grandezza del testo, che verrà definita in punti (pt), in pixel (px), in pollici (in), ed in percentuale(%).
font-size: NUMEROpx
Famiglia del font (carattere di scrittura), valori possibili:
Arial, Verdana, Georgia, sans-serif, Courier, Times, Geneva, Optima, etc etc
font-family:

Se invece volete ottenere un solo lato arrotondato dovete inserire

CODICE

<div class="code" align="left">-moz-border-radius-topleft: NUMEROpx;

se desiderate arrotondare solo in alto a sinistra

esempio:

Presentazioni

CODICE

Presentazioni

se desiderate arrotondare in alto a sinistra e in alto a destra

esempio:

Presentazioni

CODICE

Presentazioni

CODICE

<div class="code" align="left">-moz-border-radius-topright: NUMEROpx;

se desiderate arrotondare solo in alto a destra

esempio:

Presentazioni

CODICE

<div class="code" align="left">-moz-border-radius-bottomleft: NUMEROpx;

se desiderate arrotondare solo in basso a sinistra

esempio:

Presentazioni

CODICE

<div class="code" align="left">-moz-border-radius-bottomright: NUMEROpx;

se desiderate arrotondare solo in basso a destra

esempio:

Presentazioni

Questi codici CSS possono essere applicati anche ad alcuni selettori presenti nel CSS del forum in Colori e stili ad esempio .menu, .header o altri...

esempio:

CODICE

<div class="code" align="left">.menu {-moz-border-radius: 9px; background-color: #0000F0; height:25px; width:100px; color:#fff; padding:2px}

0 replies since 22/7/2011, 18:49 11 views