Archiwa Tło, Obraz, Grafika

Czym była by strona internetowa gdyby nie było na niej odpowiedniego tła, obrazów czy grafik. W tej kategorii znajdziecie więc artykuły poświęcone tematyce umieszczania ich na stronie. Chociaż nie tylko bo również obróbce ich z pomocą różnych właściwości CSS.

Dlaczego połączyłam te dwie części razem? Ponieważ bardzo często to właśnie obraz chcemy ustawić jako tło.

Pseudo-element ::backdrop CSS

Pseudo-element CSS ::backdrop stanowi pole o wielkości okna bezpośrednio za obiektem. Można więc uznać, że jest to pewna forma tła.

Dowiedz się więcej

Właściwość CSS backdrop-filter

Właściwość CSS backdrop-filter należy do grupy filtrów z ich pomocą możemy wpływać na rozmycie tła w elemencie blokowym np. <div>, <span>, <p>. Właściwość ta doskonale się sprawdzi w sytuacji kiedy chcemy umieścić tekst na grafice.

Dowiedz się więcej

Jak osiągnąć efekt skośnego tła na stronie? [CSS]

Od razu przyznam się, że kiedy pierwszy raz zobaczyłam skośne tło na stronie internetowej to myślałam, że ktoś obrócił tło strony. To była moja pierwsza myśl i jak się kazało błędna.

Dowiedz się więcej

Jak na stronie umieścić gradientowy (różnokolorowy, ombre) tekst CSS?

Dzisiaj zajmę się po raz kolejny modyfikowaniem wyglądu tekstu na stronie internetowej a konkretnie pokażę jak uzyskać efekt gradientowego tekstu czyli wielokolorowego tekstu.

Dowiedz się więcej

Tło w kształcie fali (wavy shape) z pomocą CSS

W związku z tym, że mamy wakacje postanowiłam pisać o nieco lżejszych tematach. Dlatego też dzisiaj pokażę wam jak zrobić efekt falującego tła (wavy shape, efekt fali) na stronie. W brew pozorom efekt ten przynajmniej w uproszczonej wersji jest dosyć prosty i mało czasochłonny.

Dowiedz się więcej

Lustrzane odbicia obrazków z pomocą CSS

Dzisiaj pokażę wam jak uzyskać efekt lustrzanego odbicia obrazka (ang. CSS image reflections) na stronie internetowej z pomocą CSS. Na chwilę obecną istnieje kilka różnych metod z pomocą, których uzyskać możemy złudzenie odbicia. Dziś omówię najpopularniejsze z nich.

Dowiedz się więcej

Mieszanie kolorów z selektorem mix-blend-mode [CSS]

Właściwość CSS mix-blend-mode określa sposób łączenia się ze sobą elementu nadrzędnego np. obrazka z tłem umieszczonym pod nim.

Dowiedz się więcej

Pozycjonowanie obrazka w obrębie kontenera z CSS – object-position

Właściwość CSS object-position służy do określania pozycji początkowej (położenia początkowego) wybranego elementu HTML w kontenerze.

Dowiedz się więcej

Dopasowywanie obrazka do rozmiaru obszaru roboczego CSS3 – object-fit

Z pomocą właściwości object-fit określamy w jaki sposób interesujący nas element HTML (np. obrazek) będzie wypełnić dany obszar na stronie internetowej.

Dowiedz się więcej