Version: 1.1
hypetech.pl
Wygląd

Tło

Klasy pozwalające na kontrolowanie tła elementu.

background-color

Ustawienie koloru tła. Definicja sposobu zapisu koloru znajduje się w opise typów wartości: Typy wartości.

Klasa Styl CSS
bgcolor-transparent 
background-color: transparent;
bgcolor-white 
background-color: #ffffff;
bgcolor-black 
background-color: #000000;
bgcolor--<color> 
background-color: <color>;
bgcolor-white/<int> 
background-color: rgba(255,255,255,<int>/100);
bgcolor-black/<int> 
background-color: rgba(0,0,0,<int>/100);

background-size

Rozmiar tła obrazka

Klasa Styl CSS
bgs-cover 
background-size: cover;
bgs-contain 
background-size: contain;

background-repeat

Powtarzanie obrazka tła

Klasa Styl CSS
bgrepeat-no 
background-repeat: no-repeat;
bgrepeat-yes 
background-repeat: repeat;
bgrepeat-space 
background-repeat: space;
bgrepeat-x 
background-repeat: repeat-x;
bgrepeat-y 
background-repeat: repeat-y;

background-position

Pozycjonowanie tła.

Wartości bezpośrednie mogą przyjmować wymiar zgodnie ze specyfikacją lub okreslenie pozycji z CSS, zgodnie ze specyfikacją:

  • pos-x: center, left, right
  • pos-y: center, top, bottom
Klasa Styl CSS
bgp-left 
background-position: left;
bgp-right 
background-position: right;
bgp-top 
background-position: top;
bgp-bottom 
background-position: bottom;
bgp-center 
background-position: center;
bgp-<pos-x>-<pos-y> 
background-position: <pos-x> <pos-y>;
bgp-[<dim-1|pos-x>_<dim-2|pos-y>] 
background-position: <dim-1|pos-x> <dim-2|pos-y>;

background-position-x

Ustawienie pozycjonowania tła w osi x

Klasa Styl CSS
bgx-left 
background-position-x: left;
bgx-right 
background-position-x: right;
bgx-center 
background-position-x: center;
bgx--<var> 
background-position-x: var(--<var>);
bgx-<dim> 
background-position-x: <dim>;

background-position-y

Ustawienie pozycjonowania tła w osi y

Klasa Styl CSS
bgy-top 
background-position-y: top;
bgy-bottom 
background-position-y: bottom;
bgy-center 
background-position-y: center;
bgy--<var> 
background-position-y: var(--<var>);
bgy-<dim> 
background-position-y: <dim>;