Nwlapcug.com


Come fare una barra verticale di CSS

Come fare una barra verticale di CSS


CSS o Cascading Style Sheets, viene utilizzato per indicare i browser come visualizzare gli elementi HTML. CSS possono essere memorizzati esternamente da HTML e usi i nomi di sezione per determinare quali stili di andare con ogni sezione. Questo consente di risparmiare tempo perché gli sviluppatori Web possono modificare l'aspetto di un sito completamente modificando questo file. Incorporando una barra verticale di CSS nel tuo sito può essere fatto a uno dei due modi.

Istruzioni

Utilizzando una sezione DIV

1

Aprire la pagina Web in cui si desidera aggiungere la barra verticale.

2

Aggiungere una sezione di div chiamata "vbar" nella posizione appropriata utilizzando il seguente tag:

< div id = "vbar" < / div >

3

Salvare il file.

4

Aprire il tuo file CSS. Aggiungere una sezione al file CSS con gli attributi per il verticale barra sezione, come segue:

VBar {

Larghezza:? px;

Altezza:? px;

background-color: #???;

}

Sostituire i punti interrogativi per i valori appropriati. Ad esempio, altezza e larghezza dovrebbe essere elencati in pixel utilizzando un formato simile a 10px. Colore di sfondo dovrebbe essere elencato utilizzando un valore esadecimale a sei cifre Web-safe, ad esempio #000000 per nero o #FFFFFF per il bianco. Visita il link colori CSS nella sezione "Risorse" per più colori esadecimali.

5

Salvare il file.

Utilizzando un attributo Border di sezione

6

Aprire il tuo file CSS.

7

Aggiungere un attributo border alla sezione della tua pagina che è adiacente al percorso dove si desidera che la barra verticale. Ad esempio, se si dispone di una sezione di "contenitore" che è a sinistra di cui si desidera aggiungere la barra verticale, aggiungere un attributo border-destra alla sezione al fine di creare un bordo destro.

contenitore () {

Border-destra: X;

}

Vedere la sezione "Suggerimenti" per le opzioni di attributo di bordo diversi.

8

Salvare il file.

Consigli & Avvertenze

  • L'attributo "border" può essere utilizzato per determinare la larghezza del bordo (#px, dove # è sostituito con un numero) stile (solido, punteggiato, tratteggiato, doppio, ridge, groove, inserto, inizio) o colore (#???, dove i punti interrogativi vengono sostituiti con i numeri per indicare i colori Web-safe).
  • Per esempio:
  • #container () {
  • Border-destra: #333333 3px solid;
  • }