2013-08-31 16 views
5

Я создаю пользовательское слайд-шоу и хочу, чтобы мои элементы управления слайдом всегда находились в определенном положении в нижней части окна. Для этого я использую jQuery и устанавливаю верхнее свойство div, содержащего элементы управления, в window height - 50px.Плотность пикселей влияет на позиционирование элементов на разных устройствах?

Мой вопрос: если сайт просматривается на устройстве с высокой плотностью пикселей, этот подход все еще работает? Мне нечего тестировать и оценивать любые отзывы. На мой взгляд, я думаю, что если устройство имеет высокую плотность пикселей, то 50px лишь слегка сдвинет его, но я надеюсь, что ошибаюсь.

+1

Да, это сработает. Это еще 50 пикселей. Если вы имеете в виду «сетчатый дисплей» из яблока, он будет преобразован в 100 пикселей внутри. –

+0

Спасибо, что дал мне некоторое спокойствие. – user1424761

+0

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

ответ

0

Плотность пикселей может повлиять на внешний вид, но не на макет. Плотность пикселей в целом очень, очень незначительная, и обрабатывается видеодрайверами и операционной системой, а не непосредственно с CSS. Для компаний стало известно, что рекламировать плотность пикселей как способ дифференцирования своего продукта, но это не значит, что это новая вещь.

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

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

Нижняя строка такая же, как и в течение довольно длительного времени. Создайте свой контент; тщательно протестируйте его на разных устройствах (если это возможно), и вы должны быть в порядке.

2

CSS px единиц не являются пикселями.

Это включает их использование в jQuery. px устройства не соответствуют физическим пикселям на дисплее.

w3.org имеет a page that explains px and other CSS units:

ПВ устройство магия блок CSS. Он не связан с текущим шрифтом, а также не связан с абсолютными единицами. Блок px определен как маленький, но видимый и такой, что горизонтальная 1px широкая линия может отображаться с острыми краями (без сглаживания). То, что острое, маленькое и видимое зависит от устройства и того, как оно используется: держите его близко к своим глазам, как мобильный телефон, по длине рук, как монитор компьютера, или где-то посередине, как книга? Таким образом, px не определяется как постоянная длина, а как нечто, что зависит от типа устройства и его типичного использования.

Чтобы получить представление о появлении пикс, представьте CRT монитор компьютера с 1990-х годов: наименьшая точка может отображать меры около 1/100 дюйма (0,25 мм) или немного больше. px блок получил свое название от этих пикселей экрана.

В настоящее время есть устройства, которые в принципе могут отображать более мелкие острые точки (хотя вам может понадобиться лупа для их просмотра).Но документы прошлого века, которые использовали px в CSS, по-прежнему выглядят одинаково, независимо от того, какое устройство. Принтеры, в частности, могут отображать четкие линии с гораздо меньшими деталями, чем 1px, но даже на принтерах линия 1px выглядит так же, как и на мониторе компьютера. Устройства меняются, но px всегда имеет такой же внешний вид.

Другой способ думать о том, что CSS px is an Angular Measurement:

«единицы пикселя по отношению к разрешению устройства просмотра, т.е. чаще всего на дисплее компьютера. Если плотность пикселей устройства вывода сильно отличается от плотности изображения на типичном дисплее компьютера, пользовательский агент должен масштабировать значения пикселей. Рекомендуется, чтобы опорный пиксель был визуальным углом одного пикселя на устройстве с плотностью пикселей 96dpi и расстоянием от считывателя длины руки. Для длины номинальной руки 28 дюймов, угол зрения, поэтому около 0,0213 градусов.»

Таким образом, ваш -50px должен появиться визуально быть примерно таким же размером, на любом устройстве. Фактическое количество пикселей, которое соответствует, будет зависеть от плотности пикселей устройства, от того, насколько устройство предназначено для пользователя, а также для пользовательской настройки.

+0

Huh? Я проверил это. Я взял печатный экран линии 50px на экране 72 ppi и 96 ppi. Затем я измерил размер в Paint.NET, и оба они измерялись как 50 пикселей. –

+0

Да, на это намекает комментарий W3. «Единица px определена как маленькая, но видимая, и поэтому горизонтальная 1px широкая линия может отображаться с острыми краями (без сглаживания)». Это говорит о том, что браузер может делать удвоение пикселей в стиле сетчатки, но избегать дробного масштабирования. Единственное исключение - когда пользователь установил коэффициент масштабирования браузера. Тогда, конечно, вы увидите, что ваш 50px превратится в большее количество физических пикселей. –

+0

Извините, я в замешательстве. –

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