CSS의 azimuth(방위각) 속성은 음성 기반 콘텐츠에서 소리가 수평 방향의 어느 위치에서 들려오는지를 지정합니다. 청각 스타일시트(Aural Stylesheet) 환경에서 화면을 보지 못하는 사용자에게 공간감 있는 사운드 경험을 제공할 때 활용됩니다.
azimuth 속성에 사용할 수 있는 값은 아래와 같습니다.
azimuth 속성 값의 종류
- angle − -360deg부터 360deg 사이의 각도로 위치를 지정합니다. 0deg는 음향 스테이지 중앙의 정면을 의미하며, 90deg는 오른쪽, 180deg는 뒤쪽, 270deg(또는 더 편리하게 표기한 -90deg)는 왼쪽을 나타냅니다.
- left-side − '270deg'와 동일합니다. 'behind'와 함께 사용하면 '270deg'입니다.
- far-left − '300deg'와 동일합니다. 'behind'와 함께 사용하면 '240deg'입니다.
- left − '320deg'와 동일합니다. 'behind'와 함께 사용하면 '220deg'입니다.
- center-left − '340deg'와 동일합니다. 'behind'와 함께 사용하면 '200deg'입니다.
- center − '0deg'와 동일합니다. 'behind'와 함께 사용하면 '180deg'입니다.
- center-right − '20deg'와 동일합니다. 'behind'와 함께 사용하면 '160deg'입니다.
- right − '40deg'와 동일합니다. 'behind'와 함께 사용하면 '140deg'입니다.
- far-right − '60deg'와 동일합니다. 'behind'와 함께 사용하면 '120deg'입니다.
- right-side − '90deg'와 동일합니다. 'behind'와 함께 사용하면 '90deg'입니다.
- leftwards − 현재 각도를 기준으로 소리를 왼쪽으로 이동시킵니다. 정확히는 현재 값에서 20도를 뺍니다.
- rightwards − 현재 각도를 기준으로 소리를 오른쪽으로 이동시킵니다. 정확히는 현재 값에 20도를 더합니다.
사용 예제
다음은 azimuth 속성을 실제로 적용한 예제입니다.
<style>
<!--
h1 { azimuth: 30deg }
td.a { azimuth: far-right } /* 60deg */
#12 { azimuth: behind far-right } /* 120deg */
p.comment { azimuth: behind } /* 180deg */
-->
</style>참고 사항
azimuth 속성은 CSS2의 청각 스타일시트 규격에 포함되어 있었으나, 현재는 폐기(deprecated)된 상태이며 최신 웹 브라우저에서는 지원되지 않습니다. 접근성 향상을 위한 음성 스타일링이 필요하다면 이를 대체하는 CSS Speech 모듈과 스크린 리더 호환성을 고려하는 것이 좋습니다.