1 пиксель не является 1 пикселем при применении масштабирования

ЭТО ВОПРОС, СВЯЗАННЫЙ С УСЛОВИЯМИ. Я хочу использовать Javascript только в том случае, если это необходимо.1 пиксель не является 1 пикселем при применении масштабирования

Как рисовать div, который имеет 1 пиксельную рамку, независимо от того, на каком устройстве вы его просматриваете?

Если ваша ОС имеет масштабирование включено (что у большинства пользователей есть, если у них есть монитор с высоким разрешением), вы заметите, что 1 пиксель больше не 1 пиксель. Если у вас включено масштабирование на 200%, border: 1px solid black; будет рисовать границу шириной 2 пикселя. Как вы можете это подтвердить? Добавьте это свойство и значение в свой CSS: transform: scale(0.5);. Что это делает? Это в основном уменьшает все на 50% от его первоначального размера.

Теперь, как я могу убедиться, что, когда мои значения CSS говорят 1px, это будет фактически 1 пиксель?

Вот мой пример: http://jsfiddle.net/o6x9pg6e/1/

#container { 
    width: 400px; 
    height: 400px; 
    border: 1px solid black; 
    /*transform: scale(0.5);*/ 
}

Спасибо

источник

2015-11-29 MortenMoulder

Насколько я знаю, это невозможно сделать просто с помощью CSS. Однако это можно сделать с помощью javascript. –

@jBot Все, что может это сделать, сделало бы меня в порядке. – MortenMoulder

Просто из интереса, почему вы хотите заставить 1 пиксель, если он масштабируется до 2 для случаев с высоким разрешением? – ScottMcGready

Я хотел бы начать с этого:

meta name="viewport" width="device-width"

, и, возможно, использовать параметр: user-scalable=no

источник

2015-11-29 20:25:41 Foo

Насколько я знаю, это работает только для мобильных устройств? – MortenMoulder

Не отключайте масштабирование пользователя. Вашим пользователям это не понравится. – Rudie

Я не думаю, что это позволяет избежать преобразования масштаба. – Oriol

То, что я использую для этого, совершенно не имеет значения. Почему вы, ребята, очень заботитесь о том, что такое мой вариант использования? Это мой вопрос, и вы, ребята, не должны заботиться о том, что я собираюсь использовать для

Вот мой вопрос: в моем примере, как сделать, чтобы 1px-граница была на самом деле 1px независимо от того, какая конфигурация выполняется пользователем?

Вот прямой ответ на ваш прямой вопрос: вы не можете (вообще).

источник

2015-11-29 23:43:00 zerkms

Как это ответ? – MortenMoulder

Вы спросили, как вы можете это сделать. Я ответил, что вы не можете этого сделать. Вот как это ответ. – zerkms

Комментарии не для расширенного обсуждения; этот разговор был [перемещен в чат] (http://chat.stackoverflow.com/rooms/96504/discussion-on-answer-by-zerkms-1-pixel-is-not-1-pixel-how-do- я решаемый-то). –

Это невозможно использовать CSS. На мобильном устройстве вы можете сделать это, не позволяя пользователю масштабировать его.

Единственный способ сделать это возможным - использовать Javascript, но для этого требуется браузерное решение, которое можно найти here.

источник

2015-11-30 01:38:02 jhpratt

Ваша ссылка определяет масштаб и фактический размер. Как я могу применить это в своем приложении? Как сказано, я знаю, как получить масштабирование и все (из вашей ссылки), но как я могу применить его? – MortenMoulder

Вы можете масштабировать ширину границы обратно с увеличением. Если вы хотите 1px-границу, но масштаб 300%, установите его на 1/3px (который будет вычислен (1px/3)). Я просто сделал быстрый тест в Chromium, и он работает, но лучше всего проверить это в каждом браузере. – jhpratt

Меня не интересует зум. – MortenMoulder

1 пиксель не является 1 пикселем при применении масштабирования

ответ

Смежные вопросы