Hvordan å gjøre en CSS Vertical Bar

Hvordan å gjøre en CSS Vertical Bar


CSS, eller Cascading Style Sheets, brukes til å fortelle nettlesere hvordan du viser HTML-elementer. CSS kan lagres eksternt fra HTML og bruker sidedelnavn å finne ut hvilke stiler gå med hver del. Dette sparer tid fordi webutviklere kan endre utseendet på et nettsted helt ved å endre denne filen. Innlemming en CSS vertikal bar inn på området kan gjøres på to måter.

Bruksanvisning

Ved hjelp av en DIV Seksjon

1 Åpne websiden der du ønsker å legge den vertikale linjen.

2 Legg en div seksjon kalt "vbar" til riktig sted ved hjelp av følgende kode:

<Div id = "vbar" </ div>

3 Lagre filen.

4 Åpne din CSS fil. Legg en seksjon til CSS-filen med attributter for den vertikale linjen delen, som følger:

vbar {

Bredde: px;?

høyde:? px;

bakgrunnsfarge:#??????;

}

Erstatt spørsmålstegnene for de riktige verdiene. For eksempel bør høyde og bredde være oppført i piksler ved hjelp av et format som 10px. Bakgrunnsfargen skal være oppført ved hjelp av et sekssifret Web-safe hex verdi, for eksempel # 000000 for svart eller #FFFFFF for hvit. Besøk CSS farger linken i "Ressurser" for flere hex farger.

5 Lagre filen.

Ved hjelp av en seksjon Border Egenskap

6 Åpne din CSS fil.

7 Legg til en ramme attributt til den delen av siden som er i tilknytning til det stedet der du vil at loddlinjen. For eksempel, hvis du har en "container" delen som er til venstre for der du vil legge til loddlinjen, legge til en ramme til høyre attributt til seksjonen for å skape en høyre kant.

container {

border-right: X;

}

Se "Tips" for ulike grensen attributt alternativer.

8 Lagre filen.

Hint

  • Den "grensen" attributt kan brukes til å bestemme grensen bredde (#px, der # er erstattet med et tall) stil (solid, prikkete, stiplede, dobbelt, møne, groove, innfelt, begynnelsen) eller farge (# ??? ???, hvor spørsmålstegn er erstattet med tall for å angi Web-safe farger).
  • For eksempel:
  • #container {
  • border-right: # 333333 3px solid;
  • }