Странице сајта
Prvi razred
Учесници
Општа секција
I тромесечје
II тромесечје
III тромесечје
III тромесечје
IV - тромесечје
Паурпоинт
Drugi razred
Treći razred
Četvrti razred
Brodomašinski tehničar
Nautički tehničar
Špeditersko-agencijski i carinski tehničar
Матура
Преквалификација
Стилови - својства
Претходне стране су се бавиле тиме како да примјенимо одређен стил на неки елемент. Ова страна се занима листањем неких најосновнијих својстава која се могу примјенити на елементе. Значи да поновим ако имамо овакав стил:
.plavitekst {
color: blue;
font-weight:bold;
}
.plavitekst je селектор који каже на шта ће бити примјењен овај стил (на елементе класе plavitekst) док су color: blue и font-weight:bold својства која ће бити подешена на вриједности blue и bold овим стилом.
Приликом навођења својстава и њихових опција у случају да својство има дискретне опције могућности ће бити раздвојене са /. Што значи да се може у стилу навести само ЈЕДНО такво подешавање.
Ако напишем: font-weight: bold / normal у стилу се само може навести font-weight: bold или font-weight: normal.
За остале ћу наводити само примјере.
Такође ћу наводити само неко од подешавања која су нама релативна. Линк ће бити стављен на свако својство који ће водити на стране са детањнијим објашњењима својстава.
Општа својства:
color: blue / #a000ff - Подешава боју текста у елементу. Боја се спецификује именом (blue, red, black white итд.) или хексадецималним кодом RGB вриједности (нпр. #a000ff - R=A0 B=00 G=FF).
width: 50px / 75% - Подешава ширину елемента
height: 50px / 75% - Подешава висину елемента
background-color: red / #a000ff - Боја позадине елемента. Спецификацију боје види у color.
display: inline / block - Како се елемент понаша при приказивању на страни. Inline елементи се поначају као текст и могу се слагати у редове. Block елементи заузимају читаву страну по својој висини не дозвољавајући другим елементима да се поставе поред њих (изузетак float).
float: none / left / right - Омогућава елементу да "плута" поред другог елемента. Слично опцији Wrap у Ворду.

clear: both / left / right / none - Омогућава елементима да игноришу елементе који плутају.

position: static / absolute / fixed / relative - Одређује како ће елемент бити позициониран на страни.
- static - уобичајено позиционирање
- absolute - елемент ће бити позициониран у односу на првог родитеља чија позиција није static. Ако таквог позиционира се у односу на body.
- fixed - позиционира се у односу на екран браузера. Елемен се не помјера по екрану приликом скроловања већ је фиксиран на њему.
- relative - Елемент се позиционира релативно у односу на своју уобичајену позицију.
top: 0px; left: -100px - заједно са position одређују позицију елемента. Одређују удаљеност елемента по вертикали (top) и хоризонтали (left) од релевантног елемента који зависи од position. За position: fixed; top i left одређују удаљеност елемента од горње и лијеве ивице браузера.
Примјер позиционирања:
<body>
<nav id="meni">
<ul>
<li><a href="#merc">Меркур</a></li>
<li><a href="#venus">Benera</a></li>
<li><a href="#tera">Земља</a></li>
<li><a href="#mars">Марс</a></li>
<li><a href="#jup">Јупитер</a></li>
<li><a href="#">Сатурн </a></li>
<li><a href="#">Уран</a></li>
<li><a href="#">Нептун</a></li>
</ul>
</nav>
<h1>Сунчев систем</h1>
Стил:
body{
width: 800px;
background: white;
margin: 0px auto ;
padding: 20px;
position: relative;
}
#meni {
width: 150px;
position: absolute;
left: -140px;
background: aquamarine;
}
Резултат

position: absolute на елемент #meni га је натјерао да буде позициониран у односу на body елемент. left:-140px; га је изгурао ван стране.
Текст својства
font-family: "Times New Roman" - Подешава фонт свих садржаја у елементу.
font-size: 12pt / 15px - Величина фонта
font-style: normal / italic - Курзив фонта. Ако се постави на normal текст није написан курзивом.
font-weight: normal / bold / 100-900 - Масни текст. Подешава дебљину слова.
text-align: left / right / center / justify - Поравнање текста у елементу.
text-decoration: none / underline / overline / line-through - Подвлачење (underline), провлачење (line-through) и надвлачење (overline) текста линијом.
text-indent: 15px - Увлачење првог реда текста.
line-height: 2 / 12px / 15pt - Подешава висина реда текста тј. размак између редова. Број без јединице подешава висину реда на тај број пута величину слова. Стога 1 је случај када нема размака између редова, 2 је када је размак један ред.