Logowanie

Zmniejszanie szerokości <img>

pytanie zadane 9 października 2016 w HTML i CSS przez zgrybus Pasjonat (24,860 p.)

Witam. Mam pewien problem. Mam <img> który ma wymiary 2000x800. Na deskopie wyglada naprawde ładnie, ale problem robi się na mobilce. Jest jakiś sposób, aby <img> był cały czas na statycznej wysokości ( 800px ) jak i szerekości ( 100% ), ale aby podczas zmniejszania szerekości obrazek się zmniejszał?

Zmniejszał czyli, aby zanikały piksele, które wychodzą poza obramowanie?

Wiem, że słabym polskim pisane, ale nie umiem jakoś "opisać" tego problemu ^_^

komentarz 9 października 2016 przez WlPx01 Obywatel (1,220 p.)

css -> overflow: hidden (?) dla elementu nadrzędnego dla img, którego max.szerokość będzie 100vw

komentarz 9 października 2016 przez zgrybus Pasjonat (24,860 p.)

a zadziała wtedy height: auto?

1 odpowiedź

odpowiedź 10 października 2016 przez R.orlinski Mądrala (5,490 p.)

Prosto będzie zamiast pixeli zadziałać na jednostkach vh dla wysokości i vw dla szerokości ekranu. Np 100vw to cała szerokość ekranu na każdym urządzeniu.

komentarz 10 października 2016 przez zgrybus Pasjonat (24,860 p.)

No właśnie nie oto chodzi. Nie chce, aby cały obrazek był widoczny na mobilkach, ponieważ wtedy wysokość jest bardzo mała ( zarazem chce, aby obrazek się nie spłaszczał ).

Chciałbym, aby na mobilkach zdjęcie w szerokości było powiedzmy na środku a wysokość dobrana do niego proporcjonalna.

Ktoś mi przesłał kodzik na pw -> sprawdzę i dam znać czy działa :)