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
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
|
---
title: <custom-ident>
slug: Web/CSS/custom-ident
tags:
- CSS
- CSS Data Type
- CSS Тип Данных
- Data Type
- Layout
- Reference
- Web
- Разметка
- тип данных
translation_of: Web/CSS/custom-ident
---
<div>{{CSSRef}}</div>
<p><a href="/ru/docs/Web/CSS">CSS</a> <a href="/ru/docs/Web/CSS/CSS_Types">тип данных</a> <strong><code><custom-ident></code></strong> включает любые определённые пользователем строки, используемые в качестве {{glossary("identifier", "идентификатора")}}. Они чувствительны к регистру, некоторые значения запрещены в разных контекстах, чтобы избежать неоднозначности.</p>
<h2 id="Синтаксис">Синтаксис</h2>
<p>Синтаксис <code><custom-ident></code> похож на синтаксис CSS идентификаторов (таких, как названия свойств), за исключением того, что значения <code><custom-ident></code> чувствительны к регистру. Они состоят из одного или более следующих символов:</p>
<ul>
<li>буквы латинского алфавита(от <code>A</code> до <code>Z</code>, от <code>a</code> до <code>z</code>),</li>
<li>десятеричные цифры (от <code>0</code> до <code>9</code>),</li>
<li>дефис (<code>-</code>),</li>
<li>нижнее подчёркивание (<code>_</code>),</li>
<li>экранированный символ (символ с бэкслешем перед ним, <code>\</code>),</li>
<li>символ <a class="external" href="https://ru.wikipedia.org/wiki/%D0%AE%D0%BD%D0%B8%D0%BA%D0%BE%D0%B4">Unicode</a> (бэкслеш, <code>\</code>, после которого идут от одной до шести шестнадцатеричных цифр, обозначающих кодовую точку этого символа в Unicode)</li>
</ul>
<p>Обратите внимание, что <code>id1</code>, <code>Id1</code>, <code>iD1</code> и <code>ID1</code> — это разные идентификаторы, поскольку они чувствительны к регистру. С другой стороны, так как существует несколько способов экранировать символ, <code>toto\?</code> и <code>toto\3F</code> — это один и тот же идентификатор.</p>
<h3 id="Запрещённые_значения">Запрещённые значения</h3>
<p><code><custom-ident></code> не может быть заключён в одинарные или двойные кавычки, потому что иначе он не был бы отличим от значения типа {{CSSxRef("<string>")}}. Более того, первый символ не должен быть цифрой или дефисом (<code>-</code>), если после него идёт ещё одна цифра или ещё один дефис.</p>
<p>Чтобы избежать неоднозначности, каждое свойство, использующее тип <code><custom-ident></code>, запрещает использование некоторых значений:</p>
<dl>
<dt>{{CSSxRef("animation-name")}}</dt>
<dt>{{CSSxRef("counter-reset")}}</dt>
<dt>{{CSSxRef("counter-increment")}}</dt>
<dd>Запрещают глобальные значения CSS (<code>unset</code>, <code>initial</code> и <code>inherit</code>), а также <code>none</code>.</dd>
<dt>{{CSSxRef("@counter-style")}}</dt>
<dt>{{CSSxRef("list-style-type")}}</dt>
<dd>Запрещает глобальные значения CSS (<code>unset</code>, <code>initial</code> и <code>inherit</code>), а также значения <code>none</code>, <code>inline</code> и <code>outside</code>. Также довольно много предопределённых значений используются в разных браузерах: <code>disc</code>, <code>circle</code>, <code>square</code>, <code>decimal</code>, <code>cjk-decimal</code>, <code>decimal-leading-zero</code>, <code>lower-roman</code>, <code>upper-roman</code>, <code>lower-greek</code>, <code>lower-alpha</code>, <code>lower-latin</code>, <code>upper-alpha</code>, <code>upper-latin</code>, <code>arabic-indic</code>, <code>armenian</code>, <code>bengali</code>, <code>cambodian</code>, <code>cjk-earthly-branch</code>, <code>cjk-heavenly-stem</code>, <code>cjk-ideographic</code>, <code>devanagari</code>, <code>ethiopic-numeric</code>, <code>georgian</code>, <code>gujarati</code>, <code>gurmukhi</code>, <code>hebrew</code>, <code>hiragana</code>, <code>hiragana-iroha</code>, <code>japanese-formal</code>, <code>japanese-informal</code>, <code>kannada</code>, <code>katakana</code>, <code>katakana-iroha</code>, <code>khmer</code>, <code>korean-hangul-formal</code>, <code>korean-hanja-formal</code>, <code>korean-hanja-informal</code>, <code>lao</code>, <code>lower-armenian</code>, <code>malayalam</code>, <code>mongolian</code>, <code>myanmar</code>, <code>oriya</code>, <code>persian</code>, <code>simp-chinese-formal</code>, <code>simp-chinese-informal</code>, <code>tamil</code>, <code>telugu</code>, <code>thai</code>, <code>tibetan</code>, <code>trad-chinese-formal</code>, <code>trad-chinese-informal</code>, <code>upper-armenian</code>, <code>disclosure-open</code>, and <code>disclosure-close</code>.</dd>
<dt>{{CSSxRef("grid-row-start")}}<br>
{{CSSxRef("grid-row-end")}}<br>
{{CSSxRef("grid-column-start")}}<br>
{{CSSxRef("grid-column-end")}}</dt>
<dd>Запрещают значение <code>span</code>.</dd>
<dt>{{CSSxRef("will-change")}}</dt>
<dd>Запрещают глобальные значения CSS (<code>unset</code>, <code>initial</code> и <code>inherit</code>), а так же значения <code>will-change</code>, <code>auto</code>, <code>scroll-position</code> и <code>contents</code>.</dd>
</dl>
<h2 id="Примеры">Примеры</h2>
<h3 id="Действительные_идентификаторы">Действительные идентификаторы</h3>
<pre>nono79 Состоит из букв и цифр
ground-level Состоит из букв, цифр и дефиса
-test Буквы, следующие за одним дефисом
_internal Буквы, следующие за нижним подчёркиванием
\22 toto Буквы, следующие за символом Unicode
bili\.bob Буквы и экранированная точка
</pre>
<h3 id="Недействительные_идентификаторы">Недействительные идентификаторы</h3>
<pre class="example-bad">34rem Не может начинаться с цифры
-12rad Не может начинаться с дефиса, за которым следует цифра
bili.bob Только буквы, цифры, _ и - можно не экранириовать
--toto Не может начинаться с двух дефисов подряд
'bilibob' Это тип <string>.
"bilibob" Это тип <string>.</pre>
<h2 id="Спецификации">Спецификации</h2>
<table>
<thead>
<tr>
<th>Specification</th>
<th>Status</th>
<th>Comment</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{SpecName('CSS4 Values', '#custom-idents', '<code><custom-ident></code>')}}</td>
<td>{{Spec2('CSS4 Values')}}</td>
<td></td>
</tr>
<tr>
<td>{{SpecName('CSS Will Change', '#valdef-will-change-custom-ident', '<code><custom-ident></code> for <code>will-change</code>')}}</td>
<td>{{Spec2('CSS Will Change')}}</td>
<td>Defines which values are excluded for {{CSSxRef("will-change")}}.</td>
</tr>
<tr>
<td>{{SpecName('CSS3 Counter Styles', '#typedef-counter-style-name', '<code><custom-ident></code> for <code>list-style-type</code>')}}</td>
<td>{{Spec2('CSS3 Counter Styles')}}</td>
<td>Uses <code><custom-ident></code> instead of a finite list of keywords. Defines which values are excluded for {{CSSxRef("list-style-type")}} and {{CSSxRef("@counter-style")}}.</td>
</tr>
<tr>
<td>{{SpecName('CSS3 Lists', '#counter-properties', '<code><custom-ident></code> for <code>counter-*</code>')}}</td>
<td>{{Spec2('CSS3 Lists')}}</td>
<td>Renames <code><identifier></code> to <code><custom-ident></code>. Adds its usage to the new <code>counter-set</code> property.</td>
</tr>
<tr>
<td>{{SpecName('CSS3 Animations', '#typedef-single-animation-name', '<code><custom-ident></code> for <code>animation-name</code>')}}</td>
<td>{{Spec2('CSS3 Animations')}}</td>
<td>Defines which values are excluded for {{CSSxRef("animation-name")}}.</td>
</tr>
<tr>
<td>{{SpecName('CSS3 Values', '#custom-idents', '<code><custom-ident></code>')}}</td>
<td>{{Spec2('CSS3 Values')}}</td>
<td>Renames <code><identifier></code> to <code><custom-ident></code>. Makes it a pseudo-type and forbids the use of excluded values.</td>
</tr>
<tr>
<td>{{SpecName('CSS2.1', 'syndata.html#value-def-identifier', '<code><identifier></code>')}}</td>
<td>{{Spec2('CSS2.1')}}</td>
<td>Initial definition.</td>
</tr>
</tbody>
</table>
<h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2>
<p><em>As this type is not a real type but a convenience type used to simplify the description of allowed values, there is no browser compatibility information as such.</em></p>
<h2 id="Смотрите_также">Смотрите также</h2>
<ul>
<li>{{CSSxRef("<ident>")}}</li>
</ul>
|
