CSS-ben használt attributumok 12B

• font-family: Simán megadja a betûtípus családjának nevét.
Paraméterek: családnevek: Times, Helvetica, Zapf-Chancery, Western, vagy Courier.
általános nevek:serif, sans-serif, cursive, fantasy, vagy monospace.
HTML-minta: { font-family : Paraméter }
Scriptben: objectum.style.fontFamily [ = Paraméter ]
• font-style: Betûtípus.
Paraméretek: normal (= normál; alapértelmezett), italic (= döntött), oblique (= ez is döntött).
HTML-minta: { font-style : paraméter }
Scriptben: objectum.style.fontStyle [ = paraméter ]
• font-variant: A kisbetûs betûk típusát adják meg.
Paraméterek: normal (=normál; alapértelmezett), small-caps (=kisméretű nagybetűk).
HTML-minta: { font-variant : paraméter }
Scriptben: objectum.style.fontVariant [ = paraméter ]
• font-weight: A szöveg vastagságát adja meg.
Paraméterek: normal, bold, bolder, lighter, 100, 200, 300, 400, 500, 600, 700, 800, 900.
(Érthetőbben: 400=normal / normális; 700=bold / kövér)
HTML-minta: { font-weight : paraméter }
Scriptben: objectum.style.fontWeight [ = paraméter ]
• font-size: Betûméret. Paraméter: abszolút-méret | relatív-méret | hossz | százalék. Alapérték: medium (közepes).
Az abszolút méret számokkal értelmezhetõ vagy kulcsszavak: xx-small | x-small | small | medium | large | x-large | xx-large.
Relatív méret lehetséges értékei: larger | smaller.
Hosszúság: Egy abszolút (szám)érték a méret részére.
A százalékérték a szülõelem %-ában értendõ. Csak egész szám lehet, melyet közvetlenül követ a %-jel.

HTML-minta: { font-size : paraméter }
Scriptben: objectum.style.fontSize [ = paraméter ]
Fontos megjegyzés: hacsak a "!DOCTYPE" deklarációjában másképp nem rendelkezik a programozó, akkor az Internet Explorer 6-tól fogva az addigi "medium" helyett a betűméret alapértéke "small" lett.
• @font-face: Megadja a HTML-dokumentumba beágyazott betûtípust.
Paraméterek: @font-face {font-family: családnév; src:url(valós cím);}
HTML-minta: @font-face { paraméter }
Scriptben: nem támogatott!
Megjegyzés: célszerű a betűtípus mellett megadni a pontos (esetleg relatív) URL-t is, mivel így az extrémnek számító típusok is biztosan elérhetővé válnak.
• font: Összesíti a különbözõ betûbeállításokat.
Paraméterek: { font: [ font-style || font-variant || font-weight ] font-size [ line-height ] font-family}
1. minta: SPAN {font: 24 'Comic Sans MS'}
2. minta: <SPAN STYLE="font:italic normal bolder 12pt Arial">
További érdekes paraméterek:
caption : A felhasználó által preferált betűstílus használható a feliratokban, a nyomógombokon, a címkéken, stb.
icon : Az ikon-címkék feliratának átgondolása.
menu : A menük betűinek átfogalmazása.
message-box : A párbeszéd(dialógus)-ablakok betűinek átvariálása.
small-caption : A kis irányító-billentyűk megjelenésének átírása.
status-bar : Az ablak státusz- (állapot-)sorának variálása.
HTML-minta: { font : paraméterlista }
Scriptben: objectum.style.font [ = paraméterlista ]
• letter-spacing: A betûk közötti helyet adja meg.
Paraméterek: { letter-spacing: normal | hosszúság_egység }
HTML-minta: BLOCKQUOTE { letter-spacing: 1.0em }
További hosszúság-egységeket lásd itt: htmllang7.html.
HTML-minta: { letter-spacing : paraméter }
Scriptben: objectum.style.letterSpacing [ = paraméter ]
• line-height: Bekezdésen belül a sorok távolságát adja meg.
Paraméterek: normal (alapértékek), szám, hossz, százalék.
Minta: P { line-height:8mm}
További hosszúság-egységeket lásd itt: htmllang7.html.
HTML-minta: { line-height : paraméter }
Scriptben: objectum.style.lineHeight [ = paraméter ]
• text-align: Hogyan igazítsa a szöveget a tagen belül.
Paraméterek: left (balra; alapértelmezés), right (jobbra), center (középre), justify (hasábszerűen, de ez nem mindenhol működik megfelelően - ráadásul lassú!).
HTML-minta: { text-align : paraméter }
Scriptben: objectum.style.textAlign [ = paraméter ]
• text-align-last: A szöveg igazítása az utolsó elemhez képest.
Új paraméterek a text-align-hoz képest: auto (automatikus; alapértelmezés; 100%-os öröklődés), inherit (rendezés olyan, mint a szülő-objektumban).
HTML-minta: { text-align-last : paraméter }
Scriptben: objectum.style.textAlignLast(v) [ = paraméter ]
• text-autospace: A szövegsor automatikus feltöltése üres helyekkel.
Paraméterek: none (=nincs extra feltöltés; alapértelmezés), ideograph-alpha (extra üres helyek beszúrása betűk közé; javasolt nyelvek: latin-betűsök, cirill, görög, arab és héber), ideograph-numeric (extra ürtes helyek a betűk és a számok közé), ideograph-parenthesis (extra üres helyek a karakterek és az írásjelek közé), ideograph-space (üres helyek beszúrása minden lehetséges helyre).
HTML-minta: { text-align-last : paraméter }
Scriptben: objectum.style.textAlignLast(v) [ = paraméter ]
• text-decoration: Szöveg diszítések.
Paraméterek: none (semmi), underline (aláhúzott), overline (föléhúzott), line-through (keresztülhúzott), blink (villogó, Explorer nem támogatja).
HTML-Minta: A:link, A:visited, A:active, A:hover { text-decoration: underline}
További minta: minta36.html.
HTML-minta: { text-decoration : paraméter }
Scriptben: objectum.style.textDecoration [ = paraméter ]
• textDecorationBlink: Szöveg villog. Internet Explorer nem támogatja.
Paraméterek: true (=lehetséges); false (tiltott).
HTML-minta: Nem támogatott!
Scriptben: objectum.style.textDecorationBlink [ = paraméter ]
• textDecorationLineThrough: Szöveg keresztülhúzott.
Paraméterek: true (=lehetséges); false (tiltott).
HTML-minta: Nem támogatott!
Scriptben: objectum.style.textDecorationLineThrough [ = paraméter ]
• textDecorationNone: Szöveg diszítés nélkül.
Paraméterek: true (=lehetséges); false (tiltott).
HTML-minta: Nem támogatott!
Scriptben: objectum.style.textDecorationNone [ = paraméter ]
• textDecorationOverline: Szöveg föléhúzva.
Paraméterek: true (=lehetséges); false (tiltott).
HTML-minta: Nem támogatott!
Scriptben: objectum.style.textDecorationOverline [ = paraméter ]
• textDecorationUnderline: Szöveg aláhúzva.
Paraméterek: true (=lehetséges); false (tiltott).
HTML-minta: Nem támogatott!
Scriptben: objectum.style.textDecorationUnderline [ = paraméter ]
• text-indent: Bekezdés elsõ sorának behúzása hosszmértékkel vagy százalékkal.
Minta: P { text-indent: 3em }

HTML-minta: { text-indent : paraméter }
Scriptben: objectum.style.textIndent [ = paraméter ]
• text-justify: Egy adott objektumon belüli hasábrendezést teszi szabályozhatóvá.
Paraméterek: auto (A böngésző alapértelmezése szerint), distribute (újság-szerűen több SPACE beszúrásával; főleg ázsiai nyelveknél), distribute-all-lines (mint fent, de az utolsó sort is így rendezi), distribute-center-last (jelenleg nem támogatott), inter-cluster (nincsenek szavak közti felesleges üres helyek), inter-ideograph (a képírásos nyelvek igényei szerint rendezi a szöveget), inter-word (a szavak közti rést üres helyekkel tölti fel; ez a leggyorsabb módszer; nem üködik a bekezdés utolsó sorában.), kashida (a szöveg sorait rendezi egy kiválaszott ponthoz; főként az arab nyelveknél használt; minimum Explorer 5.5-nél), newspaper (csökkenti, illetve növeli a szavak és a betűk közti üres helyeket; ideális a latinbetűs nyelveknek)
További minta: minta37.html.
HTML-minta: { text-justify : paraméter }
Scriptben: objectum.style.textJustify [ = paraméter ]
• text-kashida-space: Egy adott rendezési helyet jelöl ki a kashida-típusú rendezéshez.
Paraméterek: inherit (rendezési elv megegyezik a szülő-objektummal), százalék_érték (az adott sor %-ában; egész szám, melyet egy %-jel követ).
HTML-minta: { text-kashida-space : paraméter }
Scriptben: objectum.style.textKashidaSpace [ = paraméter ]
• text-overflow: Jelzi (...) módszerrel, ha a szöveg nem fér ki a megadott keretbe.
Paraméterek: clip (nem jelez sehogy; alapértelmezés); ellipses (...) - jelzés.
HTML-minta: { text-overflow : paraméter }
Scriptben: objectum.style.textOverflow [ = paraméter ]
• text-transform: A szöveg méretezését változtatja meg.
Paraméterek: capitalize (minden szó elsõ betûjét naggyá teszi), uppercase (minden betût naggyá tesz), lowercase(minden betût kicsivé teszi), none (semmi; alapértelmezés).
HTML-minta: { text-transform : paraméter }
Scriptben: objectum.style.textTransform [ = paraméter ]
• text-underline-position: Dekorációs pozíció szövegeknél.
Paraméterek: above (felette), below (alatta), auto (alapértelmezés; Japán nyelvi dekorációnál fontos; többinél azonos a below-val; min. Explorer 6-osnál), auto-pos (azonos az auto-val).
HTML-minta: { text-underline-position : paraméter }
Scriptben: objectum.style.textUnderlinePosition [ = paraméter ]
• vertical-align: A szöveg függõleges igazítását határozza meg.
Paraméterek: auto (automatikus), baseline (alapvonal), sub (alá), super (fölé), top (telejére), middle (középre), bottom (legalulra), text-top (szöveg telejére), text-bottom (szöveg legaljára).
HTML-minta: { vertical-align : paraméter }
Scriptben: objectum.style.verticalAlign [ = paraméter ]
• white-space: A szöveg megtörését szabályozza.
Paraméterek: normal (alapértelmezett; a sorok automatikusan megtörnek), nowrap (nincs megtörés); pre (a sortörések elő vannak készítve; min. Explorer 6-nál)
HTML-minta: { white-space : paraméter }
Scriptben: objectum.style.whiteSpace [ = paraméter ]
• width: Az adott objektum szélességét szabályozza.
Paraméterek: default (alapértelmezett; megegyezik a szülő-objektummal), width (hosszúság-egységek szerinti szélesség. Részletek: htmllang7.html), százalék_érték (egész szám, melyet egy %-jel követ)
HTML-minta: { width : paraméter }
Scriptben: objectum.style.width [ = paraméter ]
• word-break: Szótörés. Magyarul szótagolás.
Paraméterek: normal (alapértelmezett; megengedett a sortörés a szavakon belül), break-all (értelem szerint törje meg a szöveget a nem-ázsiai nyelveknél), keep-all (Nem enged meg sortörést a kínai, japán és a koreai nyelvnél. Nem ázsiai nyelveknél azonos az alapértelmezett lehetőséggel.
HTML-minta: { word-break : paraméter }
Scriptben: objectum.style.wordBreak [ = paraméter ]
• word-spacing: a szavak közötti üres hely méretét szabályozza.
Paraméterek: normal (alapértelmezett; a hagyományos méret), szabályozott_méret (szabályozott méretű beszúrási egység.
HTML-minta: { word-spacing : paraméter }
Scriptben: objectum.style.wordSpacing [ = paraméter ]
• word-wrap: túl hosszú szavak tördelésének engedélyezése.
Paraméterek: normal (alapértelmezett; a hosszú szavak megtörhetőek a határnál), break-word (lehetőség szerint elkerülendő a szótörés).
HTML-minta: { word-wrap : paraméter }
Scriptben: objectum.style.wordWrap [ = paraméter ]
• writing-mode: Írási irány választása. Minimum Explorer 5.5-nél.
Paraméterek: lr-tb (alapértelmezett; balról jobbra, majd fentről lefelé), tb-rl (fentről lefelé, majd jobbról balra írás; főként kelet-ázsiai nyelveknél).
HTML-minta: { writing-mode : paraméter }
Scriptben: objectum.style.writingMode [ = paraméter ]
22.15.b.) Színek és háttérértékek
• color: A szöveg színének meghatározása. Minták:
EM { color: red }              /* sima angol néven */
EM { color: #F00 }             /* egyszerű RGB-kód */
EM { color: #FF0000 }          /* #RRGGBB-típusú kód */
EM { color: rgb 1.0 0.0 0.0 }  /* Lehetséges tartomány a színeknél: 0.0 - 1.0 */
További színkódok és minták itt!
HTML-minta: { color : paraméter }
Scriptben: objectum.style.color [ = paraméter ]
• background-attachment: Háttérminta-parancs.
Paraméterek: scroll (alapértelmezett; a háttérminta is gördíthető), fixed (a háttérminta helyben marad = vízjel)
HTML-minta: { background-attachment : paraméter }
Scriptben: objectum.style.backgroundAttachment [ = paraméter ]
• background-color: Háttérszín.
Paraméterek: transparent (a szülő háttrszíne öröklődik; alapértelmezés) vagy színkód meghatározása: minták itt!
HTML-minta: { background-color : paraméter }
Scriptben: objectum.style.backgroundColor [ = paraméter ]
• background-image: Háttérkép.
Paraméterek: pontos URL vagy none (semmi).
HTML-minta: BODY { background-image: url(marble.gif) }
HTML-minta: { background-image : paraméter }
Scriptben: objectum.style.backgroundImage [ = paraméter ]
• background-repeat: A háttérkép ismétlõdésének szabályozása.
Paraméterek: repeat (alapértelmezés; mindkét irányba ismétlődik) , repeat-x (csak vízszintesen), repeat-y (csak függőlegesen), no-repeat (nincs ismétlődés).
HTML-minta: { background-repeat : paraméter }
Scriptben: objectum.style.backgroundRepeat [ = paraméter ]
• background-attachment: Meghatározza a háttérkép kapcsolatát a dokumentumon belüli szülő-objektummal.
Paraméterek: scroll (görgethető), fixed. (állandó)
HTML-minta: { background-attachment : paraméter }
Scriptben: objectum.style.backgroundAttachment [ = paraméter ]
• background-position-x: A háttérkép vízszintes pozíciójának adatai.
Paraméterek: length (hosszúság a mértékegységek szerint), percentage (százalék; egész érték, melyet egy %-jel követ), left/center/right (igazítás balra/középre/jobbra).
HTML-minta: { background-position-x : paraméter }
Scriptben: objectum.style.backgroundPositionX [ = paraméter ]
• background-position-y: A háttérkép függőleges pozíciójának adatai.
Paraméterek: length (hosszúság a mértékegységek szerint), percentage (százalék; egész érték, melyet egy %-jel követ), top/center/bottom (igazítás tetejére/közepére/aljára).
HTML-minta: { background-position-y : paraméter }
Scriptben: objectum.style.backgroundPositionY [ = paraméter ]
• background-position: Az egyes elemek háttérképének együttes pozícióját határozza meg. 2 érték kell: vízszintes és függõleges.
Paraméterek: Lásd: az előző 2 objektum!
HTML-minta: { background-position : paraméterpár }
Scriptben: objectum.style.backgroundPosition [ = paraméterpár ]
• background: A háttér teljes meghatározása.
Leírás: { background: background-color || background-image || background-repeat || background-attachment || background-position}
HTML-Minta: BODY {background: blue url(sample.gif) fixed}
HTML-minta: { background : paraméter_sorozat }
Scriptben: objectum.style.background [ = paraméter_sorozat ]
• További rendszer-színkódok - csak a CSS-ben!
Activeborder
Az aktív ablak fejlécének színe
Activecaption
Az aktív ablak fejlécén lévő cím színe
Appworkspace
Az aktív alkalmazás háttérszíne
Background
Az asztal háttérszíne
Buttonface
A gombok felületének színe
Buttonhighlight
Az ablakban található gombok árnyékának színe
Buttontext
Az ablakban található gombok feliratának színe
Captiontext
Ablakban a címsorok színe
Graytext
Inaktív szövegek színe
Highlight
Legördülő listában megjelölt elem színe
Hightlighttext
Kijelölt szövegrész színe
Inactiveborder
Inaktív ablak fejlécének színe
Inactivecaption
Inaktív ablak fejlécén található cím színe
Infobackground
A kis előugró súgók háttérszíne
Infotext
A ki előugró súgók szövegének színe
Menu
A menüsorok színe
Menutext
A menüelemek színe
Scrollbar
Az oldalsó gördítősáv színe
Threeddarkshadow
A térbeli elemek sötét árnyékának színe
Threedface
A térbeli elemek színe
Threedhighlight
Az éppen kiválasztott térbeli elem színe
Threedlightshadow
A térbeli elemek világos árnyékának színe
Threedshadow
A térbeli elemek sötét árnyékának színe
Window
Az aktuális dokumentumablak háttérszíne
Windowframe
Az ablakkeret színe
Windowtext
Az aktuális dokumentumablakban lévő normál szöveg színe