e-gradiva     HTML CSS JavaScript Načrtovanje  
  logotip  
SERŠ Maribor Iskanje Primeri

border

Z lastnostjo border določamo slog, barvo in širino obrobe elementa. V HTML uporbaljamo tabelo, da naredimo obrobo okoli teksta, toda z obrobo lahko naredimo veliko lepih efektov in jih dodamo vsakemu elementu.

Vrednosti določajo posamezne obrobe elementa. Z eno samo lastnostjo lahko nastavimo vrsto, debelino in barvo posameznih ali vseh robov hkrati.

lastnostopisvrednostNNIECSS
border S to lastnostjo lahko določamo vse tri vrednosti roba elementa. border-width
border-style
border-color		 4 4 1
border-bottom Določamo spodnjo obrobo elementa. border-bottom-width
border-style
border-color		 6 4 1
border-bottom-color Nastavimo barvo za spodnjo obrobo. border-color 6 4 2
border-bottom-style Nastavimo slog za spodnjo obrobo. border-style 6 4 2
border-bottom-width Nastavimo širino zaspodnjo obrobo. thin
medium
thick
dolžina		 4 4 1
border-color Nastavimo barvo za vse štiri obrobe. barva 6 4 1
border-left Nastavimo vrednost za levo obrobo. border-left-width
border-style
border-color		 6 4 1
border-left-color Nastavimo barvo za levo obrobo. border-color 6 4 2
border-left-style Nastavimo slog za levo obrobo. border-style 6 4 2
border-left-width Nastavimo širino za levo obrobo. thin
medium
thick
length		 4 4 1
border-right Nastavimo vrednosti za desno obrobo. border-right-width
border-style
border-color		 6 4 1
border-right-color Nastavimo barvo za desno obrobo. border-color 6 4 2
border-right-style Nastavimo slog za desno obrobo. border-style 6 4 2
border-right-width Nastavimo širino za desno obrobo. thin
medium
thick
length		 4 4 1
border-style Nastavimo slog za vse štiri obrobe. none
hidden
dotted
dashed
solid
double
groove
ridge
inset
outset		 6 4 1
border-top Nastavimo vrednost za zgornjo obrobo. border-top-width
border-style
border-color		 6 4 1
border-top-color Nastavimo barvo za zgornjo obrobo. border-color 6 4 2
border-top-style Nastavimo slog za zgornjo obrobo. border-style 6 4 2
border-top-width Nastavimo širino za zgornjo obrobo. thin
medium
thick
dolžina		 4 4 1
border-width Nastavimo širino za vse štiri obrobe. thin
medium
thick
dolžina		 4 4 1

Primeri

p {border: 2px red solid}
img {border: none}
div#plast5 {border-top: medium #123ABC groove}

→ Primer skupne lastnosti border

gor Gor     e-gradiva     CSS     primeri     nazaj padding   border-color naprej

SERŠ Maribor : Strokovna gimnazija : 2004 : Danijel Mom