Các thuộc tính CSS Aural Media (Phương tiện âm thanh)

CSS Aural Media Properties - Tổng quan

Các thuộc tính CSS cho **Aural Media** (phương tiện âm thanh) dùng để kiểm soát cách tài liệu được đọc lên tiếng bởi screen readers / voice browsers. Dưới đây là danh sách đầy đủ 19 thuộc tính theo CSS Speech Module.

Danh sách 19 thuộc tính

Ví dụ stylesheet aural hoàn chỉnh

@media speech {
  /* Reset cơ bản */
  * { 
    voice-family: "Vietnamese Female", "Microsoft An", female;
    speech-rate: medium;
    pitch: medium;
    richness: 50;
    stress: 50;
    volume: medium;
  }
  
  /* Cấu trúc tài liệu */
  h1 { 
    pause-before: 1s; pause-after: 500ms;
    cue-before: url("section-start.wav");
    pitch: x-high; stress: 80; richness: 70;
  }
  h2 { pause-before: 800ms; pitch: high; stress: 70; }
  h3 { pause-before: 500ms; pitch: medium; }
  
  /* Danh sách */
  li { pause-before: 200ms; }
  li::before { content: "Mục "; speak: normal; }
  
  /* Code/Technical */
  code, pre, kbd, samp { 
    speak: spell-out; 
    speech-rate: slow;
    voice-family: monospace;
  }
  
  /* Số liệu */
  .price { speak-numeral: continuous; }  /* "một trăm ngàn" */
  .phone { speak-numeral: digits; }      /* "một không không..." */
  
  /* Trích dẫn */
  blockquote { 
    play-during: url("quote-bg.wav") mix;
    azimuth: left; elevation: above;
  }
  q { azimuth: right; }
  
  /* Bỏ qua */
  .skip-speech { speak: none; }
  .silent { volume: silent; }
}

Lưu ý quan trọng

• Chỉ hoạt động trong @media speech hoặc user-agent hỗ trợ speech
• Hầu hết thuộc tính **không có hiệu lực** trên trình duyệt web visual thông thường
• Để accessibility web thực tế: ưu tiên HTML semantic + ARIA hơn CSS Speech
• CSS Speech Module Level 1: W3C Candidate Recommendation (chưa hoàn thiện hoàn toàn)