Обратный образ кнопки

Question

это мое первое сообщение здесь. Я начинаю свое путешествие с css и html. Я изо всех сил пытаюсь поставить два отзывчивых изображения друг на друга, которые будут действовать как кнопки. Я пытаюсь понять, что все содержимое отображается на одной странице (без прокрутки) и что независимо от размера экрана он всегда заполняется. Затем с портретным режимом на мобильных экранах он будет отображаться один за другим.

Это как далеко я уже: http://test.fulfeal.co.uk/shop-intro/

Я не могу понять, является ли делать с размером изображения (фактическое изображение будет изображение) или, возможно, с соответствующими размерами отд.

Заранее благодарю за помощь!

Answer 1

Для того, чтобы изображения, чтобы взять на всю высоту страницы, сначала убедитесь, что у вас есть следующее:

html, body { 
    height: 100%; 
} 

Это сделает, что ваш контент может фактически занять всю высоту страницы. Затем ваши изображения также должны быть установлены на 100%.

Чтобы изображения отображались друг на друга для мобильных устройств, вам необходимо использовать запросы css media, а затем установить изображения на display: block; width: 100%.