Quando si sta costruendo un sito Web, si desidera assicurarsi che ha un look pulito e lucido. Se si desidera modificare i bordi di una sezione, voci di menu o un'area di contenuto, è possibile utilizzare il tag HTML di confine. Tuttavia, questo tag è estremamente limitato nelle sue capacità. CSS fornisce molto più controllo sull'aspetto del bordo. Se sei già familiarità con la sintassi HTML, modificare bordi con HTML o CSS è semplice e straighforward.

Tag HTML Border

L'attributo HTML per bordi è semplicemente "bordo = larghezza" dove devi sostituire "larghezza" con il numero di pixel di larghezza e si desidera essere il bordo. È possibile utilizzare questo attributo in combinazione con altri tag, ad esempio la tabella o il tag img. Ad esempio, per visualizzare un bordo di 10 pixel-ampio intorno a un'immagine è necessario scrivere:

< IMG

SRC="example.gif"

BORDER=10>

Stili di bordo CSS

La sintassi per uno stile di bordo CSS è "border-style: tipo" dove devi sostituire "tipo" con lo stile che si desidera utilizzare. Il tipo più comune di confine è un bordo solido, ma è anche possibile creare un bordo punteggiato o tratteggiato. Per le apparizioni più complesse, è possibile utilizzare double, groove, ridge, inset o inizio. Ad esempio, si potrebbe mettere "border-style: tratteggiata" per un bordo tratteggiato.

Colore del bordo CSS

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

border-color: black;

border-color: #000000;

colore del bordo: rbg(0,0,0);

Larghezza del bordo CSS

Anche se non vuoi i bordi che sono troppo grandi, occasionalmente si desidera un bordo moderatamente spesso. Per impostare la larghezza del bordo, utilizzare la "larghezza del bordo: #px" dove devi sostituire "#" con la larghezza in pixel da utilizzare. Ad esempio, "larghezza del bordo: 4px." In alternativa, è possibile utilizzare il preset "sottile", "medium" o "spessa".

Specificare i lati separatamente utilizzando i CSS

Se si desidera impostare i valori per i lati in modo diverso, è possibile inserire "superiore," "destra", "bottom" e "sinistra" per i tag. Ad esempio, "border-top-color: #ff0000" sarà il colore solo la parte superiore o il bordo rosso.