suffix
Baseline 2023Newly available
Since September 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.
Der suffix
Deskriptor der @counter-style
Regel gibt den Inhalt an, der am Ende der Marker-Darstellung hinzugefügt wird.
Syntax
css
/* <symbol> value: string, image, or identifier */
suffix: "";
suffix: ") ";
suffix: url(bullet.png);
Werte
Der suffix
Deskriptor nimmt als Wert ein einzelnes <symbol>
an:
<symbol>
-
Gibt ein
<symbol>
an, das an die Marker-Darstellung angehängt wird. Es kann sich um ein<string>
,<image>
oder<custom-ident>
handeln.
Formale Definition
Zugehörige @-Regel | @counter-style |
---|---|
Anfangswert | ". " (full stop followed by a space) |
Berechneter Wert | wie angegeben |
Formale Syntax
suffix =
<symbol>
<symbol> =
<string> |
<image> |
<custom-ident>
<image> =
<url> |
<gradient>
<url> =
<url()> |
<src()>
<url()> =
url( <string> <url-modifier>* ) |
<url-token>
<src()> =
src( <string> <url-modifier>* )
Beispiele
Einstellen eines Suffixes für einen Zähler
HTML
html
<ul class="choices">
<li>One</li>
<li>Two</li>
<li>Three</li>
<li>None of the above</li>
</ul>
CSS
css
@counter-style options {
system: fixed;
symbols: A B C D;
suffix: ") ";
}
.choices {
list-style: options;
}
Ergebnis
Spezifikationen
Specification |
---|
CSS Counter Styles Level 3 # counter-style-suffix |
Browser-Kompatibilität
Report problems with this compatibility data on GitHubdesktop | mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
suffix |
Legend
Tip: you can click/tap on a cell for more information.
- Full support
- Full support
The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
Siehe auch
- Andere
@counter-style
Deskriptoren:system
,symbols
,additive-symbols
,negative
,prefix
,range
,pad
,speak-as
, undfallback
list-style
,list-style-image
,list-style-position
symbols()
: die funktionale Notation zur Erstellung anonymer Zählerstile- CSS-Zählerstile Modul
- CSS-Listen und Zähler Modul