Tło - CSS
Pozycja początkowa tła obrazkowego {background-origin}
W jaki sposób określić pozycję obrazka tła, względem której będą liczone wszelkie przesunięcia?
CSS 3 -
selektor { background-origin: początek }
Selektorem może być praktycznie dowolny znacznik, np. p - akapit, h1 - tytuł czy td - komórka tabeli [zobacz: Wstawianie stylów].
Natomiast jako "początek" należy wpisać:
Natomiast jako "początek" należy wpisać:
- border-box - pozycja tła będzie liczona względem krawędzi obramowania [Zobacz: Model pudełkowy]
- padding-box - pozycja tła będzie liczona względem krawędzi marginesu wewnętrznego (domyślnie)
- content-box - pozycja tła będzie liczona względem krawędzi właściwej zawartości elementu
Zgodnie z komputerowym układem współrzędnych punkt zerowy znajduje się zawsze w lewym-górnym narożniku. W przypadku modelu pudełkowego możemy mieć jednak aż trzy takie narożniki - dla różnych obszarów wewnątrz elementu. Ustalenie położenia początkowego okazuje się szczególnie przydatne, jeśli korzystamy również z przycinania tła.
Możliwe jest również określenie kilku wartości pozycji początkowej - kiedy wstawiamy w tle więcej niż jeden obrazek:
selektor { background-origin: początek obrazka 1, początek obrazka 2,... }
Przykład {background-origin}
no-repeat; left top; border-box
no-repeat; left top; padding-box
no-repeat; left top; content-box