<percentage>

Вы читаете английскую версию этой статьи, так как пока нет перевода на данный язык. Помогите нам перевести эту статью!

CSS тип данных <percentage> представляет значение в процентах. Оно часто используется, чтобы определить размер относительно родительского элемента. Проценты используются в различных свойствах, таких как width, height, margin, padding, и font-size.

Обратите внимание: Наследуются рассчитанные значения. Таким образом, даже если процентное значение используется на родительском элементе, настоящее значение (такое, как пиксели ждя типа данных <length>) будет доступно в унаследованном свойстве, а не значение в процентах.

Синтаксис

Тип данных <percentage> состоит из <number>, за которым следует знак процента (%). Так же впереди может стоять знак + или -, хотя отрицательные значения допустимы не во всех свойствах. Как и у всех единиц измерения CSS между символом процента и числом нет пробельного символа.

Интерполяция

При анимировании значения типа данных <percentage> интерполируются как натоящие числа с плавающей запятой. Скорость интерполяции зависит от функции времени, с которой используется анимация.

Примеры

Ширина и левый отступ

<div style="background-color:blue;">
  <div style="width:50%; margin-left:20%; background-color:lime;">
    Width: 50%, Left margin: 20%
  </div>
  <div style="width:30%; margin-left:60%; background-color:pink;">
    Width: 30%, Left margin: 60%
  </div>
</div>

HTML код выше будет выглядеть так:

Размер шрифта

<div style="font-size:18px;">
  <p>Full-size text (18px)</p>
  <p><span style="font-size:50%;">50%</span></p>
  <p><span style="font-size:200%;">200%</span></p>
</div> 

HTML код выше будет выглядеть так:

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

Specification Status Comment
CSS Values and Units Module Level 3
Определение '<percentage>' в этой спецификации.
Кандидат в рекомендации Нет значительных изменений после CSS Уровня 2 (ревизия 1).
CSS Level 2 (Revision 1)
Определение '<percentage>' в этой спецификации.
Рекомендация Не изменено с CSS Уровень 1.
CSS Level 1
Определение '<percentage>' в этой спецификации.
Рекомендация Первое определение.

Поддержка браузерами

Update compatibility data on GitHub
КомпьютерыМобильные
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome для AndroidFirefox для AndroidOpera для AndroidSafari on iOSSamsung Internet
<percentage>Chrome Полная поддержка 1Edge Полная поддержка 12Firefox Полная поддержка 1IE Полная поддержка 3Opera Полная поддержка ДаSafari Полная поддержка 1WebView Android Полная поддержка ≤37Chrome Android Полная поддержка 18Firefox Android Полная поддержка 4Opera Android Полная поддержка ДаSafari iOS Полная поддержка 1Samsung Internet Android Полная поддержка 1.0

Легенда

Полная поддержка  
Полная поддержка