Vlastnosti CSS

Farba a pozadie
Vlastnosť Hodnota Príklad
COLOR .....farba textu   {color:rgb(255,0,0)}
{color: #00CCFF }
{ color:rgb(100%,0%,0%)}
{color:#f00}
{color: red }
BACKGROUND-COLOR .....farba pozadia   {background-color:#f00}
BACKGROUND-IMAGE .....pozadie,obrázok   {background-image:url("obrazok.gif")}
BACKGROUND-REPEAT .....opakovanie REPEAT .....opakovanie obrázku na pozadí
NO-REPEAT .....bez opakovania
REPEAT-X .....opakovanie horizontálne
REPEAT-Y .....opakovanie vertikálne
{background-repeat:no-repeat}
BACKGROUND-ATTACHMENT .....rolovanie SCROLL .....pozadie roluje s dokumentom
FIXED .....pozadie je zafixované
{background-attachment:fixed}
BACKGROUND-POSITION .....pozícia pozadia TOP LEFT .....0%,0%
RIGHT TOP .....100%,0%
CENTER TOP .....50%,0%
CENTER .....50%,50%
RIGHT CENTER .....100%,50%
BOTTOM LEFT .....0%,100%
BOTTOM CENTER .....50%,100%
BOTTOM RIGHT .....100%,100%
40% 20%
10px 10px
body { background-position: 98% 2% }
body { background-position: top left}
BACKGROUND .....(skratka)   { background: url("favicon.gif") 98% 2% no-repeat fixed}

Text
Vlastnosť Hodnota Príklad
TEXT-INDENT .....odsadenie prvého riadku   {text-indent:5em}
TEXT-ALIGN .....zarovnanie textu LEFT
RIGHT
CENTER
JUSTIFY .....zarovná sa ľavá aj pravá strana
{text-ALIGN: left}
TEXT-DECORATION .....dekorácia textu OVERLINE .....čiara nad textom
UNDERLINE .....čiara pod textom
LINE-THROUGH .....preškrtnutá
BLINK .....blikanie
NONE .....bez dekorácie
{text-decoration:overline }
TEXT-TRANSFORM .....malé a veľké písmená LOWERCASE ....malé písmená
UPPERCASE .....veľké písmená
CAPITALIZE .....veľké písmeno na začiatku vety
NONE .....východzia hodnota
{text-transform:lowercase}
LINE-HEIGHT .....výška riadku 10px .....absolútna hodnota
30% .....percentá z aktuálnej výšky riadku
{line-height:200%}
VERTICAL-ALIGN .....vertikálne zarovnanie TOP
MIDDLE
BOTTOM
SUB
SUPER
BASELINE
TEXT-TOP
TEXT-BOTTOM
10%
{vertical-align:top}
WORD-SPACING .....medzera medzi slovami NORMAL
3em
{word-spacing:3em}
LETTER-SPACING .....medzera medzi písmenami NORMAL
2em
{letter-spacing:2em}
     


Písmo
Vlastnosť Hodnota Príklad
FONT-FAMILY .....rodina písma SERIF
SANS-SERIF
CURSIVE
FANTASY
MONOSPACE
{font-family: "Times New Roman", Times, serif}
FONT-STYLE .....štýl písma NORMAL
ITALIC
OBLIGUE
{font-style:italic}
FONT-VARIANT .....variant písma NORMAL
SMALL-CAPS .....malé písmená sú prevedené na veľké(menšie)
{font-variant:small-caps}
FONT-WEIGHT .....hrúbka písma BOLD .....(100)
EXTRA-LIGHT
LIGHT
DEMI-LIGHT
MEDIUM
DEMI-BOLD
BOLD
EXTRA-BOLD .....(900)
{font-weight:100}
{font-weight:bold}
FONT-SIZE .....veľkosť písma SMALLER .....min.
XX-SMALL
X-SMALL
SMALL
MEDIUM
LARGE
X-LARGE
XX-LARGE
LARGER .....max.
100px
20%
{font-size:150%}
{font-size:small}
FONT .....skratka   {font:bold xx-small serif}


Blok

Vlastnosť Hodnota Príklad
MARGIN-TOP
MARGIN-RIGHT
MARGIN-BOTTOM
MARGIN-LEFT
MARGIN .....skratka
nastavuje okraj prvku 100px ......(jednotky)
20%
AUTO
{margin-top:2em}
{margin:20px 20px 20px}
{margin:20px 20px 20px 30px}
PADDING-TOP
PADDING-RIGHT
PADDING-BOTTOM
PADDING-LEFT
PADDING .....skratka
nastavuje výplň prvku 100px ......(jednotky)
20%
AUTO
{padding-right:50px}
{padding:30px 40px}
{padding:30px 40px 10px 10px}
BORDER-TOP-WIDTH
BORDER-RIGHT-WIDTH
BORDER-BOTTOM-WIDTH
BORDER-LEFT-WIDTH
BORDER-WIDTH .....skratka
nastavuje šírku rámčeku THIN
MEDIUM
THICK
5px
{border-left-width:10px}
{border-width:10px 5px 20px}
{border-width:thin}
BORDER-COLOR .....farba rámčeka RED
#ff00FF
{border-color:red}
{border-color:#ff00ff}
BORDER-TOP
BORDER-RIGHT
BORDER-BOTTOM
BORDER-LEFT
BORDER
nastavenie
width/style/color

{border-top:thick solid red
{border-bottom:10px double #0f0f0f} }
BORDER-STYLE .....štýl celého rámu DOTTED .....bodkovaná čiara
DASHED .....bodkočiarkovaná čiara
SOLID .....plná čiara
DOUBLE .....dvojitá čiara
GROOVE .....3D drážka
RIDGE .....3D hrot
INSET .....3D vtlačená drážka
OUTSET .....3D hrbol
NONE .....bez okraju
{border-style:ridge}

 


Riadenie pozície

Vlastnosť Hodnota Príklad
POSITION...druh-metóda pozície ABSOLUTE .....nezávisle na ostatných objektoch
RELATIVE .....závisle k orginálnej pozícii
STATIC .....danné prehliadačom
LEFT
TOP
odsadenie x/y {position:relative;top:100px;left:300px}
WIDTH
HEIGHT
veľkosť x/y
     
CLIP ...určuje výstrižok CLIP:RECT(top right bottom left) {height:100px; width: 400px; clip: rect(0px 390px 90px 0px )}
OVERFLOW .....orezanie prvku CLIP ...orezanie je povolené bez rolovacích líšt
SCROLL ....orezanie je povolené, zobrazia sa rolovacie lišty
NONE .....bez orezania
{height:150px; width: 400px ; overflow: auto}
Z-INDEX .....prekrývanie prvkov AUTO
N .....celé číslo
{height:50px; width: 100px; z-index: 1}
VISIBILITY .....viditelnosť prvku INHER
VISIBLE
HIDDEN
{height:150px; width: 400px; visibility: hidden}
FLOAD .....spôsob obtekania LEFT
RIGHT
NONE
 
CLEAR .....povoluje obtekanie LEFT
RIGHT
BOTH
NONE
 

Klasifikácia
Vlastnosť Hodnota Príklad
DISPLAY .....druh elementu BLOCK
INLINE
LIST-ITEM
NONE
 
WHITE-SPACE .....práca z medzerami PRE
NOWRAP .....riadky sa nezalamujú
NONE .....medzera je ignorovaná
{white-space:nowrap}
LIST-STYLE-TYPE .....vzhľad značky zoznamu DISC
CIRCLE
SQUARE
DECIMAL
LOWER-ROMAN
UPPER-ROMAN
LOVER-ALPHA
UPPER-ALPHA
NONE
{list-style-type: upper-roman}
LIST-STYLE-IMAGE .....obrázok ako odrážka URL(.....)
NONE
{list-style-image: url(obrazok.gif)}
LIST-STYLE-POSITION .....umiestnenie odrážky INSIDE
OUTSIDE
{list-style-position: outside}
LIST-STYLE .....kompletné nastavenie   {list-style:circle outside }

Filtre
Filter Parametre Popis
ALPHA Opacity=0až100
FinishOpacity=0až100
Style=0až3
StartX=x
StartY=y
FinishX=x
FinishY=y
priehľadnosť
priehľadnosť
tvar transparentného prechodu
začiatok prechodu x
začiatok prechodu y
koniec prechodu x
koniec prechodu y
Priehľadnosť objektu
BLUR Add=1/0
Direction=45
Strength=
pôvodný obrázok sa pridá/nepridá
uhol smeru násobky 45°
sila rozmazania
Výtvorí efekt objektu pohybujúceho sa
veľkou rýchlosťou
CHROMA Color=#ff00AA transparentná farba Určuje priehľadnosť farby
DROPSHADOW Color=#ff000F
OffX=n
OffY=n
Positive=1/0
farba tieňu
posunutie x
posunutie y
pre netransparentnú časť/pre všetky body
Vytvorenie tieňa ,vznášanie objektu
FLIPH     Prevrátenie objektu horizontálne
FLIPV     Prevrátenie objektu vertikálne
GLOW Color=#00ff00
Strength=1až 255
Farba obrysu
Intenzita obrysu
Farbou obkreslí okraje objektu
GRAY     Zošednutie všetkých farieb
INVERT     Invertuje farby objektu
LIGHT     Osvetlenie objektu
MASK Color=#CCBBFF Farba Vytvorenie transparentnej masky
SHADOW Color=#ff99cc
Direction=45
Farba tieňu
Uhol násobok 45°
Vytvorí ťieň
WAVE Add=1/0
Freq=n
Light=0až100
Phase=0až 100
Strength=n
pridanie pôvodného obrázku/nepridanie
počet vlnoviek
svetelná intenzita
fázové posunutie vlny
intenzita efektu
Deformuje objekt do tvaru sínusoidy
XRAY     Vytvorí obrysy pôvodného objektu


Jednotky
Absolútne jednotky PX
PT
PI
IN
MM
CM
pixel
point
pica
inch
milimeter
centimeter
obrazovkový bod
typografický bod 1pt=1/72in
pica 1pi=12pt
palec 1in=2.54cm
milimeter
centimeter
platia aj záporné hodnoty
Relatívne jednotky EN
EM
EX
%
  počet písmen
výška veľkého písmena M
výška malého písmena x
percento
   

Video poker and tragamonedas gratis are the most played casinospiele. Visit our great casino and get an exclusive sign up bonus!