Bordi CSS si evolvono con il linguaggio di scripting di CSS. Bordi CSS hanno diversi stili, tra cui solido, punteggiato, tratteggiato, doppio bordi e, con CSS 3, angoli arrotondati. CSS e confini sono definiti per ogni elemento nel file HTML o in un file separato con estensione CSS collegati. Il codice è lo stesso indipendentemente da dove lo metti. Per progettare un sito web utilizzando i CSS con i bordi, è necessario un editor di testo che salverà il file di testo normale.

Istruzioni

1

Creare un file HTML aprendo l'editor di testo e cliccando su & quot; File & quot; e & quot; Nuovo & quot;. Fare clic su & quot; Salva & quot; e salvare il file come index. html.

2

Aggiungere il codice HTML di base alla pagina web. Questo è il codice HTML che indica al browser di web che il file è una pagina web. Per esempio:

& lt; html & gt;
& lt; testa & gt;
& lt; titolo & gt; Mia pagina & lt; / titolo & gt;
& lt; / testa & gt;
& lt; corpo & gt;

& lt; / corpo & gt;
& lt; / html & gt;

3

Creare una casella con i bordi aggiungendo un tag DIV e inserendo il testo desiderato nella casella. Nell'esempio, il tag DIV andrà tra i tag BODY:

& lt; html & gt;
& lt; testa & gt;
& lt; titolo & gt; Mia pagina & lt; / titolo & gt;
& lt; / testa & gt;
& lt; corpo & gt;
& lt; div & gt;
Questa è la mia pagina. Siete invitati a vederlo.
& lt; / div & gt;
& lt; / corpo & gt;
& lt; / html & gt;

4

Aggiungere il codice CSS per il tag DIV utilizzando l'elemento di stile. Utilizzare l'elemento di confine CSS per creare un bordo attorno al testo. L'elemento border prende colore, tipo e dimensione in considerazione. Per esempio:

& lt; html & gt;
& lt; testa & gt;
& lt; titolo & gt; Mia pagina & lt; / titolo & gt;
& lt; / testa & gt;
& lt; corpo & gt;
& lt; div style = & quot; border: 5px solid #000000; & quot; & gt;
Questa è la mia pagina. Siete invitati a vederlo.
& lt; / div & gt;
& lt; / corpo & gt;
& lt; / html & gt;

Il bordo è di 5 pixel di larghezza, e c'è una solida linea nera intorno al testo nel tag DIV. Un codice esadecimale viene utilizzato per rendere il bordo nero. Codici esadecimali possono essere ottenuti utilizzando un programma di selezione di colore. In alternativa si potrebbe sostituire la proprietà solida con inserto punteggiato, tratteggiato, doppio, scanalato, increspata, o dall'inizio. Angoli arrotondati richiedono l'elemento border-radius da CSS 3 tuttavia non è ancora supportato da tutti i browser. Per esempio:

& lt; div style = & quot; border: 2px punteggiato #000000; border-radius: 9px; & quot; & gt;

Questo verrà arrotondato gli angoli del bordo di 9 pixel.