Ems вместо px в инструментах разработчика Chrome?

Я использую em s везде в моих таблицах стилей, а не px. Но вычисленные стили/метрики в Chrome Developer Tools, кажется, по умолчанию, показывая мне px, даже для элементов, где я явно используются em S в стиле-листе:Ems вместо px в инструментах разработчика Chrome?

enter image description here

(Это изображение вычисленная длина для кнопки со значком из Font Awesome. Я установил padding на 0.4em, и я поднял это, чтобы увидеть, насколько высок значок.) Конечно, я могу просто разделить все на 16, но для чисел типа «14.841», это не так легко сделать в моей голове. Есть ли где-нибудь место для изменения единицы измерения длины? (Как, например, в большинстве настольных графических и графических программ, где я могу выбирать пиксели, точки, дюймы или сантиметры?) Либо это, либо есть где-то еще в инструментах dev, которые могут показывать длины в ems? (Правители, ...?)

источник

2014-10-23 Wandering Logic

К сожалению для меня, я не знаком с тем, как изменить единиц сказать, но я обычно нажмите на маленькие стрелки (например, в вашей картине, где это говорит '-webkit-внешний вид: none'), и он показывает мне числа этого элемента. Поэтому, если я использую 'padding: 1em', когда я нажимаю на маленькую стрелку, он покажет мне padding-top, padding-bottom и т. Д. В значениях EM по вашему запросу. – Arty

«Конечно, я могу разделить все на 16» ... да, но em может не быть 16px из-за наследования. В 'rem' возможно, но даже это настраивается. Логичнее использовать фиксированную известную «меру» 'px'. –

Значения, отображаемые на вкладке «Вычислимые», являются следующими: вычисляются. Поэтому они перечислены в единицах «абсолютной» длины, таких как пиксели, а не «относительная» единица длины, например, ems, rems или percent, которые основывают свой размер на некоторых других критериях. Например, если вы установите значение elment на 100% ширины окна просмотра, оно покажет вам, сколько пикселей вычисляется по ширине элемента, и нет возможности просмотреть значение в любом другом устройстве. Аналогично, поскольку вы используете ems, насколько большой ваш значок будет основываться на унаследованном размере шрифта.

На самом деле, я не тестировал это, но я думаю, что значения px, показанные на вычисленной вкладке, технически отображаются в пикселях устройства, а не в пикселях CSS, поскольку сами пиксели CSS являются единицами относительной длины (поскольку их размер основан на DPI экрана устройства).

Relative Length Units

Absolute Length Units

источник

2014-10-23 14:35:24

Они кажутся пикселями CSS. Например, если я увеличиваю до 175%, граница (которая определена как 1px) вычисляется как единицы измерения «0,571». Это связано с тем, что при 175% масштабировании, 1 пиксель устройства составляет .571 CSS пикселей. Если я увеличиваю до 200%, тогда 1 пиксель устройства составляет 0,5 пикселя CSS, поэтому граница будет равна двум пикселам устройства, а вкладка «Расчет» показывает мне «1» (пиксель CSS). Таким образом, вычисленная вкладка показывает относительную единицу длины, только ту, которая мне наименее полезна. –

Ах, разве это не интересно ... что бы это было так. Firefox и Safari также, похоже, ведут себя одинаково, показывая единицы px для всех вычисленных длин без видимого способа увидеть это в любом другом устройстве. Интересно, почему это так. Может быть, отправить запрос на функцию? –

Сверх того, вы можете выбрать, какие цвета единиц появятся в (hex, rgb, hsl), но если вы измените настройку, на новый блок попадут только определенные свойства. –

Ems вместо px в инструментах разработчика Chrome?

ответ

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