ir 기법을 위한 CSS 코드

일단 IR기법은 웹접근성을 위해 필요함

다이어그램, 표, 그래프 등이 이미지로 되어있을 때 설명하기 위함임.

대체 텍스트를 숨기는 것! (스크린리더로만 읽히도록, 화면에는 안 보임)

 

    display: block;
    position: absolute;
    overflow: hidden;
    visibility: hidden;
    margin: -1px;
    padding: 0;
    width: 1px;
    height: 1px;
    line-height: 1px;
    font-size: 1px;
    border: 0;
    clip: rect(0 0 0 0);
    clip: rect(0, 0, 0, 0);
    pointer-events: none;

 

보통 내가 작업하는 프로젝트에는 클래스 네임을 .blind 아니면 .hidden으로 정한다. 

다른 사이트보니까 ir-hidden 으로 해놓기도 하는 거 같다.