speak-as
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Die speak-as
CSS-Eigenschaft wird verwendet, um festzulegen, wie HTML-Inhalte gesprochen werden. Die ein bis drei aufgezählten Schlüsselbegriffe bestimmen die Art und Weise, wie Elemente und Text von audiellen Technologien wie Screenreadern und digitalen Assistenten wiedergegeben werden.
Diese Eigenschaft gilt für alle Inhalte, einschließlich Pseudo-Elemente, mit Ausnahme der ::marker
Pseudo-Elemente, die über eine @counter-style
mit einem definierten speak-as
-Deskriptor erstellt wurden, dieser hat Vorrang vor jedem geerbten speak-as
-Eigenschaftswert.
Syntax
/* single value syntax */
speak-as: normal;
speak-as: spell-out;
speak-as: literal-punctuation;
speak-as: digits;
speak-as: no-punctuation;
/* multiple value syntax */
speak-as: spell-out literal-punctuation;
speak-as: spell-out no-punctuation;
speak-as: digits literal-punctuation;
speak-as: digits no-punctuation;
speak-as: spell-out digits literal-punctuation;
speak-as: spell-out digits no-punctuation;
Werte
normal
-
Normale Ausspracheregeln mit Satzzeichen, die durch Pausen ersetzt werden. Zum Beispiel würde "Hello, world!" als "Hello (Pause) world (Pause)" ausgesprochen. Dies ist der Standardwert.
spell-out
-
Inhalt wird buchstabiert. Zum Beispiel würde "role" als "r" "o" "l" "e" ausgesprochen.
literal-punctuation
-
Satzzeichen werden buchstäblich ausgesprochen. Zum Beispiel würde "Hello, world!" als "Hello Komma world Ausrufezeichen" ausgesprochen.
digits
-
Zahlen werden als einzelne Ziffern ausgesprochen. Zum Beispiel würde "31" als "drei eins" ausgesprochen.
no-punctuation
-
Inhalt wird normal ohne Satzzeichen ausgesprochen. Zum Beispiel würde "Hello, world!" als "Hello" "world" ausgesprochen.
Hinweis:
Die Unterstützung der speak-as
-Eigenschaft ist begrenzt und inkonsistent in verschiedenen assistiven Technologien, wie Screenreadern oder Sprachsynthesizern, implementiert. Um sicherzustellen, dass alle ausspracheabhängigen kritischen Informationen benutzerfreundlich und für ein breites Publikum zugänglich bleiben, verlassen Sie sich nicht ausschließlich auf diese CSS-Eigenschaft, um festzulegen, wie diese Informationen audiovisuell präsentiert werden.
Formale Definition
Anfangswert | auto |
---|---|
Anwendbar auf | alle Elemente |
Vererbt | Ja |
Berechneter Wert | specified value |
Animationstyp | diskret |
Formaler Syntax
Beispiele
HTML
<p class="normal">Hello, world! I'm 25.</p>
<p class="spell-out">Hello, world! I'm 25.</p>
<p class="literal-punctuation">Hello, world! I'm 25.</p>
<p class="no-punctuation">Hello, world! I'm 25.</p>
<p class="digits">Hello, world! I'm 25.</p>
<p class="multi">Hello, world! I'm 25.</p>
CSS
.normal {
speak-as: normal;
}
.spell-out {
speak-as: spell-out;
}
.literal-punctuation {
speak-as: literal-punctuation;
}
.no-punctuation {
speak-as: no-punctuation;
}
.digits {
speak-as: digits;
}
.multi {
speak-as: literal-punctuation digits;
}
Spezifikationen
Specification |
---|
CSS Speech Module Level 1 # speaking-props-speak-as |
Browser-Kompatibilität
Report problems with this compatibility data on GitHubdesktop | mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
speak-as | ||||||||||||
digits | ||||||||||||
literal-punctuation | ||||||||||||
no-punctuation | ||||||||||||
normal | ||||||||||||
spell-out |
Legend
Tip: you can click/tap on a cell for more information.
- Full support
- Full support
- No support
- No support
- Experimental. Expect behavior to change in the future.
- See implementation notes.
Siehe auch
@counter-style
at-rulespeak-as
Deskriptor- Modul CSS counter styles
- Modul CSS lists and counters
- Web Speech API