1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
|
---
title: Вычисленное значение
slug: Web/CSS/computed_value
tags:
- CSS
- Guide
- Web
translation_of: Web/CSS/computed_value
---
<div>{{cssref}}</div>
<p><strong>Вычисленное значение</strong> CSS-свойства вычисляется из указанного значения посредством:</p>
<ul>
<li>Обработки специальных значений {{cssxref("inherit")}} и {{cssxref("initial")}}, а также</li>
<li>Выполнения вычислений необходимых для получения значения, описанного в строке "Обработка значения" в описании свойства.</li>
</ul>
<p>Вычисления необходимые для получения <strong>вычисленного значения</strong> для свойства обычно включают в себя преобразование относительных значений (например, находящиеся в единицах <code>em</code> или в процентах) в абсолютные значения.</p>
<p>Например, если у элемента указаны значения <code>font-size: 16px</code> и <code>padding-top: 2em</code>, то вычисленное значение <code>padding-top</code> будет <code>32px</code> (двойной размер шрифта).</p>
<p>Однако, для некоторых свойств <em>(таких, где проценты относительны к чему-то, что может потребовать лэйаут определять(переопределить) границы, например, <code>width</code>, <code>margin-right</code>, <code>text-indent</code> и <code>top</code>)</em>, процентно указанные значения преобразуются в процентно вычисляемые значения. Кроме того, безразмерные числа, указанные в свойстве <code>line-height</code> становятся вычисленными значениями. Эти относительные единицы, которые остались в вычисленных значениях, становятся абсолютными, когда <a href="/ru/docs/CSS/used_value">используемое значение</a> установлено.</p>
<p>Основная сфера применения<strong> <em>вычисленного значения</em></strong> <em>(кроме как использования его как "шага" между <a href="/ru/docs/Web/CSS/Указанное_значение">указанным</a> и <a href="/ru/docs/Web/CSS/used_value">используемым</a> значением) </em>является <a class="internal" href="/ru/docs/Web/CSS/inheritance">наследование</a>, включая ключевое слово {{cssxref("inherit")}}.</p>
<h2 id="Замечания">Замечания</h2>
<p>DOM API {{domxref("Window.getComputedStyle", "getComputedStyle()")}} возвращает {{cssxref("resolved_value", "решённое значение")}}, которое может быть либо {{cssxref("computed_value", "вычисляемым")}} или {{cssxref("used_value", "используемым")}} значением, в зависимости от свойства.</p>
<h2 id="Спецификации">Спецификации</h2>
<table class="standard-table">
<thead>
<tr>
<th scope="col">Спецификация</th>
<th scope="col">Статус</th>
<th scope="col">Комментарий</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{SpecName("CSS2.1", "cascade.html#computed-value", "computed value")}}</td>
<td>{{Spec2("CSS2.1")}}</td>
<td>Изначальное определение</td>
</tr>
</tbody>
</table>
<h2 id="Смотрите_также">Смотрите также</h2>
<ul>
<li><a href="/ru/docs/Web/CSS/Reference">Руководство по CSS</a></li>
<li>{{CSS_key_concepts}}</li>
</ul>
|
