2016-08-19 1 views
0

Надеясь, что кто-то может посоветовать хорошую стратегию для этого.Элементы с переменным размером на экране

У меня есть страница, которую я пытаюсь закодировать, на которой есть пять элементов. Содержимое этих элементов будет меняться, поскольку вы используете страницу ... иногда состоящую из текста, иногда изображений ... и, что важно, высота содержимого изменится (все построено с использованием JavaScript). Идея состоит в том, что все это будет видно на экране сразу. enter image description here

Проблема в том, что я хочу, чтобы элементы сохраняли свои позиции на экране (например, верхний левый, точный центр и т. Д.) Независимо от размера остальных. Например, элемент в середине может быть одной строкой текста и может внезапно стать высотой изображения 300 px, а затем может стать 100 px высоким изображением. Когда это произойдет, я не хочу, чтобы объекты под ним двигались вверх или вниз.

(PS: это будет использоваться только на настольном компьютере)

Есть ли способ HTML или CSS это, чтобы дать эти элементы абсолютные позиции (например, один, один в середине: 50% от верхней , 50% слева, в центре экрана) независимо от размера других? Раньше я просто использовал разрывы строк и позицию вещей, используя высоту линии, но это приводит к тому, что элементы на экране становятся меньше, чтобы «перемещаться» вниз, когда более высокие изменяются.

Любая помощь или предложения будут оценены!

+0

* Есть ли способ HTML или CSS это, чтобы дать эти элементы абсолютные позиции (например, тот, который находится посередине: 50% сверху, 50% слева, в центре экрана) независимо от размера других? * ДА. Вот несколько советов: http://stackoverflow.com/a/36817384/3597276 –

+0

Также вы должны опубликовать любой код, который вы пробовали. –

ответ

1

youc может использовать CSS для этого, вы должны попробовать с позиции собственности (относительная/абсолютная)/Проверьте это link и это link