Quando si sta costruendo un sito web, si vuole fare in modo che abbia un look pulito e lucidato. Se si desidera modificare i confini di una sezione, le voci di menu o di un area di contenuto, è possibile utilizzare il tag HTML confine. Tuttavia, questo tag è estremamente limitato nelle sue capacità. CSS fornisce molto più controllo sulla forma di frontiera. Se si ha già familiarità con la sintassi HTML, modificando i confini con HTML o CSS è semplice e straighforward.

Tag HTML Border

L'attributo HTML per i bordi è semplicemente "border = larghezza" in cui si sostituisce "larghezza" con il numero di pixel di larghezza si desidera che il confine sia. È possibile utilizzare questo attributo in combinazione con altri tag come ad esempio il tag tavolo o IMG. Ad esempio, per visualizzare un livello di 10 pixel di bordo attorno a un'immagine si può scrivere:

<IMG

SRC="example.gif"

BORDER = 10>

Stili CSS Border

La sintassi per uno stile di bordo CSS è "border-style: tipo" in cui si sostituisce "tipo" con lo stile che si desidera utilizzare. Il tipo più comune di confine è un bordo continuo, ma è anche possibile creare un bordo tratteggiata. Per le apparenze più complesse, è possibile utilizzare doppio, groove, ridge, inset o fin dall'inizio. A titolo di esempio, si potrebbe mettere "border-style: tratteggiata" per un bordo tratteggiato.

CSS Colore bordo

Per impostare il colore di un bordo a un colore di base, si può semplicemente utilizzare il nome. Ad esempio, "rosso" o "nero". Per i colori più specifici, è necessario individuare il codice esadecimale oi valori RGB per il colore. È possibile specificare il colore utilizzando il tag "border-color". Ad esempio, i seguenti tre esempi saranno tutti produrre lo stesso colore:

border-color: black;

border-color: # 000000;

border-color: RBG (0,0,0);

CSS larghezza del bordo

Anche se non si desidera che i confini che sono troppo grandi, a volte si desidera un bordo moderatamente spessa. Per impostare la larghezza del bordo, utilizzare il "border-width: #px" in cui si sostituisce "#" con la larghezza in pixel che si desidera utilizzare. Ad esempio, "border-width: 4px." In alternativa, è possibile utilizzare le impostazioni predefinite "sottile", "medio" o "spesso".

Specifica lati separatamente utilizzando i CSS

Se si desidera impostare i valori per i lati in modo diverso, è possibile inserire "top", "destra", "fondo" e "sinistra" nei tag. Ad esempio, "border-top-color: # ff0000" coloreranno solo la parte superiore o il rosso di confine.