Proprietà del bordo di CSS

Se desiderate regolare tutte e quattro le larghezze allo stesso tempo, nella disposizione A la B C e D come descritta sopra, la proprietà di bordo-larghezza è usata. Il valore può essere sottile, medio, spesso, o un valore e un'unità numerici, quali 5px o 0.2em.

In ogni paragrafo se desiderate ad un bordo medio intorno, potreste usare:

Codice di CSS

p { border-width: medium; }
/* This sets all to medium */
p { border-width: medium medium; }
/* This sets top/bottom medium then right/left medium */
p { border-width: medium medium medium medium; }
/* Set each A B C and D */

Il bordo di difetto è bordo affatto, se desiderate qualunque bordo comparire visivamente, voi dovrà aggiungere una seconda proprietà, bordo-stile. I valori per bordo-stile sono: nessun, punteggiato, tratteggiato, solido, doppio, scanalatura, cresta, inserzione, inizio.

Così facciamo ogni paragrafo avere un bordo medio che è punteggiato:

Codice di CSS

p { border-width: medium; border-style: dotted; }

Variante della serie completa di caratteri

Così vicino ad ottenere il nostro bordo perfetto. Ma che cosa se il bordo da essere semplice blu. La proprietà di bordo-colore è regolata all'azzurro

p { border-width: medium; border-style: dotted; border-color: blue; }

Non sarebbe piacevole avere una proprietà di combinazione? Ci è esso è bordo giusto e prevede la larghezza, lo stile, quindi il colore. Così l'esempio immediatamente sopra ha potuto essere facilitato:

Codice di CSS

p { border: medium dotted blue; }

Se potete regolare individualmente ciascuno dei quattro bordi. Le proprietà sono bordo-parte superiore, bordo-di destra, bordo-parte inferiore e bordo-di sinistra. I valori previsti sono larghezza, stile, allora colorano. Se desideraste ogni paragrafo con un bordo di sinistra punteggiato nel colore rosso e un giusto bordo tratteggiato nella porpora, potreste usare:

CSS Code

p { border-left: dotted red; border-right: dashed purple; }

La tabella follwing descrive le proprietà del bordo:

Property	Description	values
border	A shorthand property for setting all of the properties for the four borders in one declaration	border-width border-style border-color
border-bottom	A shorthand property for setting all of the properties for the bottom border in one declaration	border-bottom-width border-style border-color
border-bottom-color	Sets the color of the bottom border	border-color
border-bottom-style	Sets the style of the bottom border	border-style
border-bottom-width	Sets the width of the bottom border	thin medium thick length
border-color	Sets the color of the four borders, can have from one to four colors	color
border-left	A shorthand property for setting all of the properties for the left border in one declaration	border-left-width border-style border-color
border-left-color	Sets the color of the left border	border-color
border-left-style	Sets the style of the left border/td>	border-style
border-left-width	Sets the width of the left border	thin medium thick length
border-right	A shorthand property for setting all of the properties for the right border in one declaration	order-right-width border-style border-color
border-right-color	Sets the color of the right border	border-color
border-right-style	Sets the style of the right border	border-style
border-right-width	Sets the width of the right border	thin medium thick length
border-style	Sets the style of the four borders, can have from one to four styles	none hidden dotted dashed solid double groove ridge inset outset
border-top	A shorthand property for setting all of the properties for the top border in one declaration	border-top-width border-style border-color
border-top-color	Sets the color of the top border	border-color
border-top-style	Sets the style of the top border	border-style
border-top-width	Sets the witdth of the top border	thin medium thick length
border-width	A shorthand property for setting the width of the four borders in one declaration, can have from one to four values	thin medium thick length