프로세스UI1 단계를 나타내는 UI - 프로세스 이미지화 디자인상으로는 컬러나 텍스트로 변화를 줘서, 해당 단계임을 나타내보일 수 있지만, 보이지 않을 경우, 현재 단계가 어디인지를 나타내주어야한다. 그런경우 아래와 같이 써본다. ol > li > span.hidden 위와 같은 구조로 봤을 때, hidden 처리 된 span 엘리먼트 안에 "현재 페이지" 또는 "현재 단계"의 텍스트를 넣어주면 보이지 않는 경우에도 현재 단계가 어디인지 나타내 줄 수 있다. 응용적으로 hidden 처리 시킨 span 을 그림에서와 같이 아래 화살표 모양의 디자인을 넣어줘서 디자인도 만족시키고, 추가적인 태그 추가 등을 막을 수 있다. HTML5 에 WAI-ARIA 속성이 적용되면서 해당 UI에 WAI-ARIA 를 추가한 구조를 아래처럼 나타낼 수 있다. 1단계 2단계 3단계 .. 2021. 6. 29. 이전 1 다음
