`<length-percentage>` тип CSS

<length-percentage> CSS тип данных представляет значение, которое может быть либо <length>, либо <percentage>.

Синтаксис

Подробную информацию об отдельных синтаксических конструкциях, допустимых для этого типа, см. в документации по <length> и <percentage>.

Формальный синтаксис

<length-percentage> = 
  <length> |
  <percentage>

Примеры

Примеры length-percentage

В этом примере показано несколько свойств, использующих значения <length-percentage>.

HTML

<p>You can use percentages and lengths in so many places.</p>

CSS

p {
  /* length-percentage examples */
  width: 75%;
  height: 200px;
  margin: 3rem;
  padding: 1%;
  border-radius: 10px 10%;
  font-size: 250%;
  line-height: 1.5em;

  /* length examples */
  text-shadow: 1px 1px 1px red;
  border: 5px solid red;
  letter-spacing: 3px;

  /* percentage example */
  text-size-adjust: 20%;
}

Результат

Использование в calc()

Если <length-percentage> указан в качестве допустимого типа, это означает, что процентное значение преобразуется в длину и поэтому может использоваться в выражении calc(). Таким образом, для width допустимы все следующие значения:

width: 200px;
width: 20%;
width: calc(100% - 200px);

Спецификации

Совместимость с браузерами

См. также

• <percentage>
• <length>
• модуль значений и единиц CSS