'property: 0' или 'property: 0px' в CSS?

86

Я видел, как эта нотация использовалась часто, и мне было интересно, есть ли какая-нибудь заметная разница между этими двумя обозначениями?

element#id
{
  property: 0;
}

а также

element#id
{
  property: 0px;
}

Я использую property: 0px;все время, так как он выглядит чище, но я не совсем уверен, интерпретирует ли браузер 0pxиначе, чем 0.

Кто-нибудь знает, какой лучше или правильный?

css properties zero

— Блендер
источник

1

Хороший вопрос, и раньше, чем этот вероятный дубликат: stackoverflow.com/q/5359222/292060 , но у него есть лучший ответ, цитируя спецификацию.

— goodeye

1

Что бы вы ни использовали, убедитесь, что вы придерживаетесь единообразия на протяжении всего проекта.

— PBwebD

56

Идентификаторы единиц измерения, по желанию , но не отмеченное увеличение производительности (хотя являются экономия два символов).

CSS2 - Из спецификации W3C CSS 2.1 для синтаксиса и основных типов данных :

Формат значения длины (обозначается <length> в этой спецификации) - это <number> (с десятичной точкой или без нее), за которым сразу следует идентификатор единицы (например, px, em и т. Д.). После нулевой длины идентификатор единицы необязателен.

(Акцент мой)

CSS3 - Из модуля W3C CSS Values and Units Module Level 3 ( на момент написания этой статьи находится в стадии рекомендации кандидата )

Для нулевой длины идентификатор блока является необязательным (т.е. может быть синтаксически представлен как 0).

— Крис Бир
источник

1

Сомневаюсь, что вы действительно сэкономите 2 байта при активном сжатии GZIP. Для меня это вопрос того, что вам удобно. Однако некоторым линтерам CSS может не нравиться 0px.

— Мануэль Арвед Шмидт

34

Хотя единица измерения является необязательной, когда значение равно 0, я обычно оставляю ее, так как затем я могу настроить значения с помощью инструментов разработчика Chrome, щелкнув значение и нажав клавиши со стрелками вверх / вниз. Без юнита это невозможно.

Кроме того, минификаторы CSS в 0любом случае удаляют единицы значений из значений, так что в конечном итоге это не имеет особого значения.

— Блендер
источник

+1 за то, что заметил, что минификаторы знают об этом и что их можно использовать.

— Грэм П. Хит

9

В инструментах разработчика Chrome по умолчанию установлено значение px, если вы нажимаете клавиши со стрелками вверх / вниз на 0 без идентификатора. Кроме того, в инструментах разработчика Chrome, если вы переместите стрелку вниз до 0, пиксель останется.

— PBwebD

1

@ testing123: Я не думаю, что это было так, когда я писал этот ответ, но это полезно знать.

— Blender

будут ли проблемы с временем выполнения с 0 и 0px, если они используются в нескольких местах в приложении?

— Куркула,

15

Они одинаковые. Браузер интерпретирует оба значения как 0, поэтому выбирайте то, что вам удобнее.

— Себастьян Патане Масуэли
источник

Есть ли «правильный» или соответствующий стандартам выбор? Я знаю, что вы не можете писать border: 3 solid, так как единиц нет, но есть ли веб-стандарты на нуле?

— Blender

1

Как я упоминал в своем ответе, это потому, что все они идентичны: ноль раз все равно нулю, умножаете ли вы на размер пикселя, em, ex или на процент.

— AgentConundrum

Не уверен, что вы имеете в виду под веб-стандартами, но «margin: 10px 0 0 10px» работает нормально, как и «border: 0», что означает, что вы можете использовать ноль как эквивалент «none».

— Tom

1

@blender Проверьте мой ответ ниже на предмет веб-стандартов со ссылкой на документацию.

— Chris Bier

3

-1 за ответ с спорным содержанием без каких-либо ссылок, ссылок или обоснования. пожалуйста, либо подкрепите свое мнение данными, либо четко укажите, что это просто ваше мнение, а не фактическая информация.

11

Ноль чего-либо - это ноль. 0px= 0%= 0em= 0pt=0

Большинство людей оставляют устройство выключенным, потому что это просто ненужный беспорядок.

— Чак
источник

1

Исключением являются единицы времени: 0не является допустимой альтернативой 0s/0ms

— Хенрик Кристенсен

5

Насколько я знаю , нет никакой разницы между ними, так как 0px = 0em = 0ex = 0% = 0. Только вам, как разработчику, решать, что вам больше нравится (если, конечно, у вас нет корпоративных стандартов кодирования, которым вы должны следовать).

Из большинства примеров кода, которые я видел, большинство людей используют безразмерную версию. Для меня это выглядит чище. Если вы отправляете значительный объем данных (например, в Google), эти два байта могут увеличить пропускную способность, тем более что вы, скорее всего, будете повторять их несколько раз в своей таблице стилей.

— AgentConundrum
источник

6

Если вы продвигаете значительный объем данных (например, в Google), вам лучше использовать инструменты минификации, которые сделают это за вас: p

— Джон Курлак,

4

Нулевые пиксели равны нулю дюймов, нулю метрам и так далее. 0это все, что тебе нужно.

— Медер Омуралиев
источник

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

— Web_Designer

2

Я лично считаю, что 0чище 0px. Это два дополнительных символа, которые можно сложить. Зачем добавлять лишние байты, когда в этом нет необходимости. Я видел, padding: 0px 0px 0px 0pxчто padding: 0слишком часто можно выразить словами.

— Амир Раминфар
источник

1

Вы можете использовать любой из них - мой лучший совет - не слишком беспокоиться, но будьте последовательны в том, чтобы делать это так или иначе. Я лично предпочитаю указывать "0px" по следующим причинам:

Использование 0px делает вещи более согласованными со всеми другими указанными вами размерами пикселей.
Он также более подробный и дает понять, что вы устанавливаете нулевую длину, а не флаг `` отключить это ''.
Немного проще настроить значение '0px', чтобы при необходимости сделать его другим значением.

— Крис Хэлкроу
источник

0

Как говорят другие, на самом деле не имеет значения, равен ли он 0, хотя я предпочитаю добавлять измерения ко всем своим значениям, чтобы любой, кто смотрит на мои файлы CSS, мог оценить, с какими измерениями они, вероятно, будут иметь дело в другом месте.

— Данджа
источник