CSS podjela : CSS Classification

Svojstva CSS podjela se ne nasljeđuju s roditeljskih elemenata na elemente potomke.

Tekuće : Float

Svojstvo float služi promjeni načina na koji su tekst (ili slike) prikazani. Kada dodijelimo svojstvu vrijednost left ili right tekst (odnosno slika) će biti prikazani uz lijevi odnosno desni rub roditeljskog elementa. U slučaju da dodijelimo vrijednost svojstvu none ne će biti promjene u prikazu teksta ili slike.

Primjer:

float: vrijednost;

Vrijednost može biti:

  • left
  • right
  • none

Web dizajn svaki dan? Pokušaj!

Obriši : Clear

Svojstvo clear omogućava nadzor nad elementima na koja je postavljeno svojstvo float. Djelovanje svojstva float možemo poništiti pomoću ovog svojstva.

Primjer:

clear: vrijednost;

Vrijednost može biti:

    3
  • none
  • both
  • left
  • right

Vrijednost svojstva none ne poništava djelovanje svojstva float, vrijednosti left i right poništavaju djelovanje samo jednog dodijeljenog svojstva (float: left; odnosno float: right;)

Vrijednost svojstva both poništava djelovanje oba dodijeljena svojstva (float: left; i float: right;)

Prikaz : Display

Svojstvo display služi promjeni načina kako je element prikazan na zaslonu.

U html-u razlikujemo unaprijed određene elemente blok tipa nakon kojih web preglednik automatski prelazi u novi red i linijske (inline) tip elemenata nakon kojih web preglednik ostaje u istom redu. Primjer blok elemenata u html-u su <p>, <h1>...<h6>, <table>,... Primjer linijskih (inline) elemenata su <a>, <img>, <em>...

Kada želimo promijeniti unaprijed određeno svojstvo blok ili linijskog elementa koristimo svojstvo display.

Primjer:

display: vrijednost;

Vrijednost može biti:

  • block
  • inline
  • list-item
  • none

Postavljanjem vrijednosti block, element postaje blok element (bez obzira je li prije bio linijski element). Pomoću vrijednosti inline, element postaje linijski (engl. inline) element. Pomoću vrijednosti svojstva list-item element se ponaša kao stavka numeričkog ili simboličkog popisa (dodaje se novi redak prije elementa i poslije elementa).

Dodjeljivanje vrijednost svojstva none element ne će biti prikazan na web stranici.

Prelijevanje : Overflow

Svojstvo overflow služi određivanju ponašanja dijelova elementa kada se njegov sadržaj preljeva preko zadanih granica. Ukoliko sadržaj elementa prelazi granice širine ili visine svojstvom overflow možemo odrediti što se događa sa sadržajem izvan područja elementa.

Primjer:

overflow: vrijednost;

Vrijednost može biti:

  • auto
  • hidden
  • visible
  • scroll

Za vrijednost svojstva hidden sadržaj elementa koji prelazi zadane granice elementa će biti nevidljiv. Za vrijednost svojstva visible sadržaj elementa koji prelazi zadane granice ostat će u potpunosti vidljiv. Postavimo li vrijednost svojstva scroll pojavit će se vodoravna i okomita klizna traka.

Web dizajn i zarada? Zašto ne!

Vidljivost : Visibility

Svojstvo visibility služi određivanju hoće li element biti prikazan na web stranici.

Primjer:

visibility: vrijednost;

Vrijednost može biti:

  • hidden
  • visible

Z indeks : Z index

Svojstvo z-index određuje redoslijeda pozicioniranja elemenata u sloju.

Primjer:

z-index: vrijednost;

Vrijednost može biti:

  • auto
  • broj

Veći dodijeljeni broj z-index svojstvu znači viši položaj unutar sloja. Dopušteni su i negativni brojevi.

Pokazivač miša : Cursor

Svojstvom cursor određujemo izgled pokazivača miša koji će se koristiti unutar elementa.

Primjer:

cursor: vrijednost;

Vrijednost može biti:

  • auto
  • crosshair
  • default
  • help
  • move
  • pointer
  • text
  • url
  • wait
  • e-resize
  • ne-resize
  • nw-resize
  • n-resize
  • se-resize
  • sw-resize
  • s-resize
  • w-resize

Ako postavim slobodno odabranu sliku kao pokazivač miša (korištenjem vrijednosti svojstva url), uvijek je dobra praksa deklarirati uz njega i neku od zadanih vrijednosti.

cursor: url('slika.cur'), default;