[CSS] Skalowanie
Rafał Miśkowiec
2/9/2017 | 10:49 PM

Witam jak zrobić, aby zdjęcie w: #header .devices { background: rgba(0, 0, 0, 0) url("../img/top-gfxa1700.jpg") no-repeat scroll 0 0 / cover ; Wczytał poprawnie, tzn. aby było widoczne całe i potem skalowało się jak to poniżej na stronie. Czy mam się odnieść do: #header.home-slider .computers { height: 690px; position: relative; } #header.home-slider .item { width: 100%; } ?

Piotr Palarz
2/14/2017 | 10:55 AM

Można je dodać jako <img> (z pustym atrybutem alt) natomiast pozostałą treść (gdyby się w tym kontenerze znajdowała) pozycjonować absolutnie z top: 50% i transform: translateY(-50%) co wyśrodkuje w pionie taki boks np. z tekstem.

Rafał Miśkowiec
2/13/2017 | 9:26 PM

:)

Uzytkownik Anonimowy
2/13/2017 | 8:33 PM

To pytanie poniżej jest moje.

Uzytkownik Anonimowy
2/13/2017 | 6:10 PM

Ok, a proszę o info i spojrzenie pod kątem co jest lepsze. Jakie rozwiązanie Pan by zastosował na swojej stronie w takiej sytuacji? Czy można to zdjęcie dodać jako img czy zasady mówią, że tak się nie powinno robić? Dziękuję za pomoc!

Piotr Palarz
2/13/2017 | 9:52 AM

Prawdopodobnie najlepszym rozwiązaniem będzie pozostawienie wartości background-size: cover i dodanie odpowiedniego breakpointu @media dla szerokości max-width: szerokość_obrazka_z_tłem gdzie background-size ustawi Pan na wartość contain Natomiast ogólnie nie da się uzyskać takiego samego efektu jak poniżej, bo tam jest zdjęcie dodane jako <img> a więc ono "fizycznie" zajmuje miejsce i kiedy się skaluje, to zmniejsza się jego wysokość, a co za tym idzie, boksu, w którym się znajduje. Kiedy obrazek jest przypisany jako tło, to nie ma on właściwości fizycznych, a jego wielkość zależy od kontenera, w którym się znajduje.

Rafał Miśkowiec
2/12/2017 | 7:27 PM

Jak pomoc od eksperta nadejdzie?:)

Rafał Miśkowiec
2/11/2017 | 9:27 AM

To może uporządkuje myśl, bo faktycznie nie jest zbyt precyzyjnie napisane. 1. Na początku to zdjęcie nie jest pokazywane w 100%, tak jest ucięte. Jak to zmienić? 2. W trakcie zmniejszania okna, przestaje się skalować. Pomogło to o czym pisał Daniel, dzięki:) Warto odświeżać stronę po zmianie;) Ale na wysokości stylów mobile zdjęcie przestaje się skalować. Ten element ma być na wszystkich urzą-ach

Rafał Miśkowiec
2/10/2017 | 6:03 PM

Tak, i wygląda, że nie pokazuje całego zdjęcia. Cel jest taki, żeby skalowało się równomiernie, a teraz tak jakby inaczej. To na dole zachowuje się w pożądany sposób.

Rafał Miśkowiec
2/10/2017 | 5:59 PM

www.e-scs.eu

Daniel Manaj
2/10/2017 | 1:26 PM

Rozumiem, że nie "całe" oznacza ucięte? background-size: 100% 100%; próbowałeś?

Piotr Palarz
2/10/2017 | 11:16 AM

Proszę podrzucić link do strony :)