Nwlapcug.com


Come fare una linea orizzontale in fogli di stile CSS esterni

Non devi utilizzare un programma di fotoritocco per creare righe variopinte per pagine Web. Linee e forme..--quando posizionato strategicamente..--possono aggiungere interesse per siti Web e consentono di organizzare e separare le informazioni sulle pagine Web affollate. Utilizzando un foglio di stile CSS esterno, è possibile trasformare qualsiasi browser in una macchina di disegno che consente di posizionare su misura linee orizzontali ovunque che ti piace su qualsiasi pagina Web.

Istruzioni

1

Aprire il blocco note e incollare il codice seguente in un nuovo documento:

div.line () {
background-color: Blue;
Larghezza: 200px;
Altezza: 2px;
}

Questo codice CSS definisce gli attributi per l'elemento div che si utilizzerà per creare la linea orizzontale. L'attributo background-color imposta il colore della linea. Gli attributi width e height determinano la larghezza e l'altezza in pixel della linea. Modificare i valori di larghezza e altezza su qualcosa che ti piace. Sostituire "Blue" con qualsiasi nome di colore HTML valido. Trovare nomi di colori di colore valido HTML sul Web tramite la ricerca di nomi di colori HTML.

2

Salvare il documento con estensione "CSS". Questa operazione crea un foglio di stile CSS esterno.

3

Avviare qualsiasi editor HTML e aprire uno dei documenti HTML.

4

Incollare il codice riportato di seguito nella sezione head del documento:

< link href="STYLE_SHEET_NAME.css" rel = "stylesheet" type = "text/css" / >

Sostituire "STYLE_SHEET_NAME.css" con il nome del foglio di stile che è stato salvato. L'aggiunta di questo codice aggiunge il foglio di stile al documento HTML.

5

Trovare la sezione del corpo del documento e incollare il seguente codice dove vuoi che venga visualizzata la linea:

< div class = "riga" / >

Questa singola riga di codice crea la linea definita nel foglio di stile CSS esterno.

6

Salvare il documento e visualizzarlo in un browser per vedere la linea sulla tua pagina Web.

Consigli & Avvertenze

  • Fare una linea orizzontale a coprire la larghezza della pagina Web modificando il valore di larghezza a "100%".
  • Posto molte linee come avete bisogno sulle tue pagine Web aggiungendo il codice div indicato precedentemente per il codice.
  • Rendere le linee più spesse aumentando il valore di larghezza nel foglio di stile CSS esterno.