Объяснение для изображений с шириной и высотой, чтобы быть отзывчивым

Question

Может ли кто-нибудь объяснить мне концепцию изображений, чтобы быть отзывчивостью? И где мы должны использовать ширину и высоту для изображений, некоторые говорили мне, что. Неправильно брать ширину и высоту для изображений, может кто-нибудь уточнить.

Answer 1

Когда вы используете адаптивные изображения на своей странице, это означает, что вы показываете различные размеры изображения в зависимости от размера экрана. например, на экране мобильного телефона вы показываете уменьшенное изображение, а на экране рабочего стола - то же изображение, но с большим разрешением. эта логика может быть сделана через HTML или CSS.

Answer 2

Если вы хотите полностью адаптивное изображение - вы можете использовать div с фоновым изображением, background-size: cover (или 100%) и background-position: center center

Answer 3

Для изображения Ширина: 100% и высота: авто;это будет работать для отзывчивого. но родительский элемент может иметь или не иметь ширину. Хорошая практика - фиксированная ширина и высота.