JS border CSS funkcije
| JS funkcije |
Objašnjenje |
Vrednosti |
Objašnjenje vrednosti |
E |
F |
O |
| border borderBottom
borderLeft
borderRight
borderTop
outline |
Definisanje debljine linije |
thin |
tanka linija |
4 |
1 |
9 |
| medium |
srednje debljine |
| thick |
debela linija |
| debljina linija u px |
Definisanje debljine u pikselima |
| Definisanje stila linije |
none |
bez stila |
| hidden |
skriven |
| dotted |
tufne |
| dashed |
isprekidana linija |
| solid |
puna linija |
| double |
dupla linija |
| groove |
brazda |
| ridge |
greben |
| inset |
umetak |
| outset |
ispupčenje |
| Definisanje boje linije |
red |
ime boje, blue, black ... |
| rgb(123,34,213) |
RGB boja |
| #ACA445 |
Heksadecimalna boja |
Funkcija border se odnosi za sve 4 linije koje ograničavaju elemente.
Medjutim mi možemo definisati i svaku liniju posebno. Tako na primer ako umesto
border napišemo borderleft onda će mo definisati samo levu ivicu
elementa. BorderRight definiše desnu ivicu, borderTop definiše
gornju liniju elementa, a borderBottom donju ivicu. I border, i
borderLeft, borderRight, borderBottom i borderTop imaju iste vrednosti za
definisanje boje, stila i debljine linija.
Kao što vidimo u tabeli egzistira i outline funkcija. Outline u CSS je
u stvari linija koja uokviruje i sam border! I outline takodje ima iste
vrednosti za boju, stil linije i debljinu linije, pa da ne bi pravili zasebnu
tabelu mi smo i nju smestilu u ovoj tabeli sa border funkcijama. Outline
funkciju ne podržava Internet Explorer.
Evo jednog primera i za border i za outline:
<html><head>
<script type="text/javascript">
function element(a){
if(a == "border") document.getElementById("p1").style.border="5px double
#0000FF";
if(a == "outline") document.getElementById("p1").style.outline="6px inset
#FF00FF";
}
</script>
</head><body>
<input type="button" onclick=element("border") value="Promeni border"><br>
<input type="button" onclick=element("outline") value="Promeni outline">
<p id="p1">Ovo je paragraf</p>
</body></html>
