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
137
138
139
140
141
142
|
---
title: <string>
slug: Web/CSS/string
translation_of: Web/CSS/string
---
<div>{{CSSRef}}</div>
<div>在CSS中,<strong><code><string></code></strong> 是用来表示一串字符的数据类型,它被用在众多CSS属性中,例如{{cssxref("content")}}、{{cssxref("font-family")}}、和{{cssxref("quotes")}}。</div>
<h2 id="使用规则">使用规则</h2>
<p><strong><code><string></code></strong> 数据类型是由包含在英文双引号(<strong><code>"</code></strong>)或英文单引号(<font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);"><strong>'</strong></span></font>)中的任意数量的Unicode字符组成。</p>
<p>大多数字符都可以写成字面量的形式,并且所有字符都可以写成以反斜线(<code><strong>\</strong></code>)开头的十六进制Unicode码点的形式。比如说:<code><strong>\22</strong></code>表示一个双引号,<code><strong>\27</strong></code>表示一个单引号,<code><strong>\A9</strong></code>表示版权声明符号(<code><strong>©</strong></code>)。</p>
<p>需要注意的是,在使用某些特殊字符时需要在前面加上反斜线来转义,包括但不限于在双引号字符串中使用双引号字符,在单引号字符串中使用单引号字符,以及反斜线字符,比如<code><strong>\\</strong></code>表示一个反斜线字符。</p>
<p>当你想换行的时候,必须使用像<code><strong>\A</strong></code>或者<code><strong>\00000A</strong></code>这样的换行符。不过在你的代码中,可以通过在每行末尾增加一个反斜线(<code><strong>\</strong></code>)的方式来创建一个多行的字符串。</p>
<div class="note">
<p><strong>注意:</strong> CSS<code><strong><string></strong></code>中不能使用像<code><strong>&nbsp;</strong></code>或者<code><strong>&#8212;</strong></code>这样的实体。</p>
</div>
<h2 id="例子">例子</h2>
<pre>/* Simple strings */
"This string is demarkated by double quotes."
'This string is demarkated by single quotes.'
/* Character escaping */
"This is a string with \" an escaped double quote."
"This string also has \22 an escaped double quote."
'This is a string with \' an escaped single quote.'
'This string also has \27 an escaped single quote.'
"This is a string with \\ an escaped backslash."
/* New line in a string */
"This string has a \Aline break in it."
/* String spanning two lines of code (these two strings will have identical output) */
"A really long \
awesome string"
"A really long awesome string"
</pre>
<h2 id="规范">规范</h2>
<table class="standard-table">
<thead>
<tr>
<th scope="col">Specification</th>
<th scope="col">Status</th>
<th scope="col">Comment</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{SpecName('CSS3 Values', '#strings', '<string>')}}</td>
<td>{{Spec2('CSS3 Values')}}</td>
<td>No significant change from CSS Level 2 (Revision 1).</td>
</tr>
<tr>
<td>{{SpecName('CSS2.1', 'syndata.html#strings', '<string>')}}</td>
<td>{{Spec2('CSS2.1')}}</td>
<td>Explicit definition; allows 6-digit Unicode escaped characters.</td>
</tr>
<tr>
<td>{{SpecName('CSS1', '', '<string>')}}</td>
<td>{{Spec2('CSS1')}}</td>
<td>Implicit definition; allows 4-digit Unicode escaped characters.</td>
</tr>
</tbody>
</table>
<h2 id="浏览器兼容性">浏览器兼容性</h2>
<p>{{CompatibilityTable}}</p>
<div id="compat-desktop">
<table class="compat-table">
<tbody>
<tr>
<th>Feature</th>
<th>Chrome</th>
<th>Firefox (Gecko)</th>
<th>Internet Explorer</th>
<th>Opera</th>
<th>Safari</th>
</tr>
<tr>
<td>Basic support</td>
<td>1.0</td>
<td>1.0 (1.0)</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{compatVersionUnknown}}</td>
<td>1.0 (85)</td>
</tr>
<tr>
<td>\xx</td>
<td>1.0</td>
<td>1.0 (1.0)</td>
<td>6.0</td>
<td>{{compatVersionUnknown}}</td>
<td>1.0 (85)</td>
</tr>
</tbody>
</table>
</div>
<div id="compat-mobile">
<table class="compat-table">
<tbody>
<tr>
<th>Feature</th>
<th>Android</th>
<th>Chrome for Android</th>
<th>Firefox Mobile (Gecko)</th>
<th>IE Mobile</th>
<th>Opera Mobile</th>
<th>Safari Mobile</th>
</tr>
<tr>
<td>Basic support</td>
<td>{{compatVersionUnknown}}</td>
<td>{{compatVersionUnknown}}</td>
<td>{{compatVersionUnknown}}</td>
<td>{{compatVersionUnknown}}</td>
<td>{{compatVersionUnknown}}</td>
<td>{{compatVersionUnknown}}</td>
</tr>
<tr>
<td>\xx</td>
<td>{{compatVersionUnknown}}</td>
<td>{{compatVersionUnknown}}</td>
<td>{{compatVersionUnknown}}</td>
<td>{{compatVersionUnknown}}</td>
<td>{{compatVersionUnknown}}</td>
<td>{{compatVersionUnknown}}</td>
</tr>
</tbody>
</table>
</div>
|