/ / Най-добрият начин да направите колажната страница напълно отзивчива? - css, html5, отзивчив дизайн

Най-добрият начин да направите колажната страница напълно отзивчива? - css, html5, отзивчив дизайн

Имам колаж като целева страница ... нещо подобно:

въведете описанието на изображението тук

Всеки обект на тази страница е отделно изображение - обвито в абсолютно позиционирано Div.

Сега целта ми е да направя тази страница напълно отзивчива. Какъв е най-добрият начин да постигнете това?

Отговори:

1 за отговор № 1

За подобно оформление щях да направя абсолютнотопозициите са процентно мащабирани, ширината на изображението е процентно мащабно, а пък изображенията са центрирани върху абсолютните им позиции, като се използват отрицателни процентни маржове (равняващи се на половината процентна ширина). Също така използвайте процентните размери на шрифта. Ако го направите, мисля, че всичко трябва да се мащабира повече или по-малко, сякаш е един образ. След това можете да използвате мултимедийни заявки, за да скриете нещата или да направите оформлението различно при прекъсвания, ако е необходимо.

Ето един пример:

  #collage-item {
top: 20.3%;
left: 34%;
width: 2.1%;
height: 1.89%;
margin-left: -1.05%;
margin-top: -0.945%;
font-size: 50%;
}

0 за отговор № 2

Вашият най-добър залог е да погледнете някои CSS Frameworks, за да ви помогнем да постигнете това, 2 пролет в ума

1) Twitter Bootstrap
2) Фондация Зурб

Въпреки че има много повече там, харесвам тези две, тъй като те са много лесни за персонализиране.