Prejsť na stránku Partner Sladkakytica.sk
Zabudli ste heslo? Nemáte účet? Vytvorte si ho!
 
Úvod arrow Všetky články arrow CSS kaskádové štýly - pomoc pre Joomla šablóny

Články k Joomla 1.5

Články súvisiace s Joomla 1.5.xx
 ---------------------------------------
 
 

Ikonka Joomla.einfo.sk

Joomla.einfo.sk
CSS kaskádové štýly - pomoc pre Joomla šablóny PDF Tlačiť E-mail
Hodnotenie čitateľov: / 10
SlabéVynikajúce 
03. 12. 2008 | Články | Prečítané 6912x
Niekoľko definícií, ktoré sa môžu zísť pri úprave Joomal! šablón template.css a podobné súbory...

Zdroj nasledovnej poznamky je: kirp.chtf.stuba.sk

Relatívne jednotky:

  • em: výška aktuálneho písma (je rovnaká, ako šírka písmena "M")
  • ex: výška písmena "x"
  • px: pixel/bod obrazovky

Absolútne jednotky:

  • in: palce (inches), 1 palec je 2.54 centimetra
  • cm: centimetre
  • mm: millimetre
  • pt: body (points),  použiteľné v CSS2, 1 pt je 1/72 palca.
  • pc: picas, 1 pica je 12 bodo (points).

Vlastnosti písma:

  • Font-family: názov písma (, názov písma 2, ..), generické meno (predstavuje názov pre rodinu písiem):
    serif | sans-serif | cursive | fantasy | monospace / pätkové písmo | bezpätkové písmo | ozdobné písmo, kurzíva | ornamentálne písmo | neproporcionálne písmo
  • Font-style: štýl písma:
    normal | italic | oblique / normálne, šikmé, sklonené
  • Font-variant: variant písma:
    normal | small-caps / normálne | kapitálky
  • Font-weight:  tučnosť písma:
    normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
  • Font-size: veľkosť písma:
    absolútna (xx-small | x-small | small | medium | large | x-large | xx-large)
    relatívna (larger | smaller)
    v percentách voči okolitému písmu
    výška (v jednotkách ptm, em )

Formátovanie textu:
  • text-indent: odsadenie prvého riadku textu (odstavca) od ľavého okraja
    dĺžka | percentá / v jednotkách dĺžky | v percentách šírky oblasti
  • text-align: zarovnanie textu horizontálne
    left | right | center | justify / | vľavo | vpravo | do stredu | na oba okraje
  • text-decoration: efekty textu
    none | [ underline || overline || line-through || blink] / žiadny efekt | [podčiarknutý text || nadčiarknutý text || prečiarknutý text || blikajúci text, nie každý prehliadač podporuje blikanie]
  • letter-spacing: nastavenie medzier medzi znakmi
    normal | dĺžka / normálna vzdialenosť | presná dĺžka medzier, môžeme zadávať aj záporné hodnoty
  • word-spacing: nastavenie medzery medzi slovami
    normal | dĺžka / normálna vzdialenosť | presná dĺžka medzier, môžeme zadávať aj záporné hodnoty
  • text-transform: transformácie textu
    capitalize | uppercase | lowercase | none / kapitálky | všetky veľké | všetky malé | bez transformácie
  • vertical-align: zarovnanie vertikálne, napr. v bunkách tabuľky
    baseline | sub | super | top | text-top | middle | bottom | text-bottom | percentá | dĺžka / na základňu | dolný index | horný index | horný okraj najvyššieho elementu | vrchná časť textu | na stred | spodný okraj najnižšieho elementu | spodný okraj textu | posunutie o počet percent z výšky textu | presná vzdialensť
  • line-height: riadkovanie
    normal | číslo | dĺžka | percentá / normálne riadkovanie (110%, vzhľadom na diakritiku by sme mali používať aspoň 120%) | násobok normálneho riadkovanie | konkrétna hodnota | percentom z výšky písma|

Rámčeky (neviditeľný rámček obklopujúci text/objekt, jeho oddelenie od okolitej časti)
  • margin-top: miesto nad textom
    dĺžka | percento / vdialenosť v dĺžkových jednotkách | v percentách zo šírky oblasti
  • margin-bottom: miesto po textom
    dĺžka | percento / vdialenosť v dĺžkových jednotkách | v percentách zo šírky oblasti
  • margin-left: miesto vľavo od textu
    dĺžka | percento / vdialenosť v dĺžkových jednotkách | v percentách zo šírky oblasti
  • margin-right: miesto vpravo od textu
    dĺžka | percento / vdialenosť v dĺžkových jednotkách | v percentách zo šírky oblasti
  • padding-top: zväčšenie rámčeku nad textom
    dĺžka | percento / vdialenosť v dĺžkových jednotkách | v percentách zo šírky oblasti
  • padding-bottom: zväčšenie rámčeku pod textom
    dĺžka | percento / vdialenosť v dĺžkových jednotkách | v percentách zo šírky oblasti
  • padding-left: zväčšenie rámčeku vľavo od textu
    dĺžka | percento / vdialenosť v dĺžkových jednotkách | v percentách zo šírky oblasti
  • padding-right: zväčšenie rámčeku vpravo od textu
    dĺžka | percento / vdialenosť v dĺžkových jednotkách | v percentách zo šírky oblasti
  • border-top(bottom/left/right)-width - šírka hranice rámčeka hore (dole/vľavo/vpravo)
    thin | medium | thick | hodnota / tenká | stredná | tučná | presná hodnota
  • border-top(bottom/left/right)-color - farba hranice rámčeka hore (dole/vľavo/vpravo)
    #rgf - od 0 do F
    #rrggbb - od 00 do FF
    rgb(r,g,b) - od 0 do 255
    rgb(r%, g%, b%) - od 0% do 100%
  • border-top(bottom/left/right)-style - štýl hranice rámčeka hore (dole/vľavo/vpravo)
    none - ruší vykreslenie rámčeka
    hidden - skrité vykreslenie
    dotted - bodkované
    dashed - čiarkovane
    solid - spojitá čiara
    double - dvojitá čiara
    groove - priestorový rámček
    ridge - priestorový vystúpený rámček
    inset - osvetlený priestorový vtlačený rámček
    outset -osvetlený priestorový vtlačený rámček

Určenie pozície:

Existujú dva odlišné spôsoby určovanie pozície objektu na obrazovke. Absolútny a relatívny. Absolútna pozícia umiestni objekt na do stránku na určené súradnice, bez ohľadu na text okolo neho. Relatívna pozícia určuje, o koľko a má objekt posunúť oproti svojej normálnej pozícii.

  • position: určenie pozície elementu na stránke
      absolute: absolútne určenie pozície elementu na stránke
      left, right, top, bottom - pozícia zľava, z prava, z hora a zdola
      relative: relatívne určenie pozície elementu na stránke
      left, right, top, bottom - pozícia zľava, z prava, z hora a zdola
  • http://www.kirp.chtf.stuba.sk/~cirka/vyuka/xhtml/literatura/02/
    z-index: "vrstva", v ktorej sa element nachádza, pri pozíciovaní sa môžu elementy prekrývať, z-index určuje, ktorý bude hore
    hodnota - celé číslo, element s väčším z-indexom prekrýva element s nižším z-indexom

Odkazy:

Štýly môžeme priradiť aj odkazom. Dokonca aj v závislosti od toho, či je aktívny alebo navštívený, príp. ak sa naň nastavíme myškou.

  • a.link: normálny odkaz
  • a.visited: navštívený odkaz
  • a.hover: odkaz, nad ktorým je myška
  • a.active: aktívny odkaz

Viac o CSS TU
 
Komentáre:
farby
Napísal(a) Táto e-mailová adresa je chránená pred spamovými robotmi, potrebujete mať zapnutý Javascript aby ste ju mohli vidieť. dňa: 2009-04-12 20:35:07
chcel by som sa spytat kde by som nasiel nazvy farieb,alebo nejaku aplikaciu podla ktorej zistim meno farby napr.#fff 
 
 
dakujem
RE: farby
Napísal(a) Monika dňa: 2009-04-12 23:36:31
Farebne schemy vidis aj tu ColorSchemeDesigner.com  
alebo si nainstaluj rozsirenie pre firefox http://www.colorzilla.com/firefox/ 
ale moznosti je viac...hladaj na webe :-)
RE: farby2x
Napísal(a) Monika dňa: 2009-04-12 23:38:04
Samozrejme to najdolezitejsie: v PSPad mas tuto moznosti tiez
dakujem
Napísal(a) phillip dňa: 2009-04-17 20:52:23
dakujem pekne,ale prisiel som na to otvorim si prehliadac v gimpe...je to vlastne jedno v ktorom grafickom editore..
Vycentrovanie Banneru
Napísal(a) Táto e-mailová adresa je chránená pred spamovými robotmi, potrebujete mať zapnutý Javascript aby ste ju mohli vidieť. dňa: 2009-08-26 12:55:08
Pomozte prosim, kde sa da vycentrovat vlozeny banner v module mod_banners (reklamny pruzok) Dakujem!
Len registrovaní užívatelia môžu komentovať článok.
Registrujte sa prosím.
 
Ďalšia >

Neprehliadnite!

Internet-Marketing-Strategie.sk

SOBI2 Menu

Joomla! Webhosting

Je doména voľná?
.


NajWeb.sk

Kniha hostí

Jozef
Ahojte, treba nainštalovať nejaký plugin, aby RSS v Joomla 1,5,22 ve
 

Najviac komentované

1. Virtuemart - es (62 x)
2. Highslide JS -  (54 x)
3. Virtuemart - úp (49 x)
4. SOBI 2 - Sigsiu (35 x)
5. Inštalácia Joom (31 x)

Odporúčam: