CSS масштабирует все элементы

У меня есть файл CSS, связанный с проектом, в котором все размеры и смещения элементов (например, изображения и шрифты) определяются с использованием значений пикселей. Эти значения пикселей основаны на целевой платформе с фиксированным разрешением экрана 960x540.

Я хотел бы масштабировать все эти значения для другой платформы, использующей разрешение 1280x720, и я ищу инструмент, который позволит мне это сделать. Используемые платформы не имеют большой мощности процессора, и они не все поддерживают одинаковую степень функциональности CSS3, поэтому я бы предпочел не пытаться делать это во время выполнения в приложении.

Я ничего не нашел в Google, так что кто-нибудь знает об онлайн-инструменте, который сделает эту работу?


person user2337247    schedule 30.04.2013    source источник
comment
Вы изучали медиа-запросы CSS?   -  person Jonah    schedule 30.04.2013


Ответы (2)


Это может быть не очень полезно прямо сейчас. nofollow noreferrer">lesscss.

Хорошо то, что вы можете определить глобальные переменные и тому подобное, поэтому вы можете просто указать в верхней части файла ширину и высоту экрана и использовать эти переменные для расчета масштаба для других элементов.
Например:

@w: 1280px;
@h: 720px;

#some_div {
    width: @w / 2;
    height: @h / 2;
}

Когда вы закончите писать, инструмент js компилирует файл lesscss в допустимый CSS, который вы затем можете использовать для своего приложения.
Поэтому, когда вам нужно снова изменить разрешение, вы меняете только две переменные @w и @h и компилируете CSS. очередной раз.

person Daniel W.    schedule 16.03.2014

медиазапросы CSS были бы лучшим решением, но вы не хотите использовать CSS3, тогда вы можете использовать JavaScript. Что-то вроде Adapt.js должно помочь.

person user2313440    schedule 30.04.2013
comment
Я не думаю, что объяснил это хорошо. Я хочу изменить файл CSS в автономном режиме, чтобы значения пикселей автоматически масштабировались для нового разрешения, а не вручную. - person user2337247; 01.05.2013