CSS
 Computer >> コンピューター >  >> プログラミング >> CSS

CSSのspeech-rateプロパティ：読み上げ速度の指定方法

speech-rateプロパティは、音声読み上げの速度（話す速さ）を指定するためのプロパティです。絶対的なキーワード値と相対的なキーワード値の両方が使用できる点に注意してください。

speech-rateプロパティに指定できる値

  • number − 1分あたりの読み上げ単語数（words per minute）で速度を数値指定します。
  • x-slow − 1分あたり80語と同等の、非常に遅い速度です。
  • slow − 1分あたり120語と同等の、遅い速度です。
  • medium − 1分あたり180〜200語と同等の、標準的な速度です。
  • fast − 1分あたり300語と同等の、速い速度です。
  • x-fast − 1分あたり500語と同等の、非常に速い速度です。
  • faster − 現在の読み上げ速度に、1分あたり40語を加算します。
  • slower − 現在の読み上げ速度から、1分あたり40語を減算します。

使用例

以下のように記述することで、要素の読み上げ速度を変更できます。

p.slow-speech {
  speech-rate: slow;
}
p.custom-rate {
  speech-rate: 250;
}

なお、speech-rateプロパティはCSS Speechモジュール（旧Auralスタイルシート）に属するプロパティで、主にスクリーンリーダーなどの音声読み上げブラウザ向けの速度制御に使用されます。視覚的な表示には影響しないため、アクセシビリティ向上を目的とした場面で活用すると効果的です。

  1. CSSのwriting-modeプロパティ徹底解説！テキストを縦書き・横書きにする方法

    writing-modeプロパティとは CSSのwriting-modeプロパティは、テキストの行を水平方向にレイアウトするか、垂直方向にレイアウトするかを指定するためのプロパティです。日本語の縦書きのように、上から下へ文字を読ませるレイアウトも簡単に実現できます。 基本構文 writing-mode: horizontal-tb | vertical-rl | vertical-lr; 指定できる主な値 horizontal-tb … 行が上から下へ流れる標準的な横書き表示（初期値） vertical-rl … 行が右から左へ流れる縦書き表示。日本語や中国語などの縦組みレイアウトに適し

  2. CSSのpointer-eventsプロパティとは？使い方をコード例で解説

    pointer-eventsプロパティとは CSSのpointer-eventsプロパティは、要素に対してポインターイベントが発生した際に、その要素がアクション（反応）を行うかどうかを指定するためのプロパティです。ポインターイベントは、マウスのクリック、タッチ操作、スタイラスペンなど、さまざまな入力デバイスによって発生します。 このプロパティを活用すると、リンクやボタンへのクリック・ホバー操作を無効化したり、逆に有効化したりできます。主な値は以下のとおりです。 auto：デフォルトの動作。要素が通常どおりポインターイベントに反応します。 none：要素がポインターイベントに反応しなくなります