당최 이걸 어떻게..해야할지 ㅠ.ㅠ

웹표준/접근성도 맞춰야하는 프로젝트중입니다 ^^;;

아래 표를 짜야하는데.... 급수별로 걸쳐져 있는것도 있고 그 아래로 테이블선 지나가고..

머리는 굴리며 이렇게 저렇게 시도하는데..계속 실패네요.. ㅠ.ㅠ

어떻게 하면 좋을까요?? 고수님들의 조언 부탁드립니다 ...

ps.매일 퇴근은 한밤중에...(오늘 추운데...ㅠ.ㅠ)

댓글 10

  • 그댸와나 2026.04.10

    통이미지에 대체텍스트로 하는 건 어떻까요?
    복잡하게 디자인된 표, 조직도 등 이런 것들은 통이미지로 가고
    그에 대한 설명만 잘 넣어줘도 상관 없을 것 같은데요.. 웹 접근성 연구소 사이트 가서 한번 찾아보세요

  • 라임나무 2026.04.10

    마감을 앞두고 막 쳐내고 있는 상황이라....ㅠ.ㅠ
    요청을 몇번했으나....거절당함 ㅠ.ㅠ
    여백까지 자르는 방법을 고려중이에요 ;;;;;

  • 모든 2026.04.10

    표 서너개로 분리하면 이해도 쉽고 표현도 쉬울꺼 같은데 참 안타깝네요. 이해도 잘 안가요;
    표준이다, 접근성이다 이런 프로젝트는 많지만 클라이언트나 기획쪽도 생각을 좀 바꿔야 할 것입니다.

    저라면 위의 표의 정확한 의미를 알아내서 기획, 디자인에 수정을 요청하겠습니다.

  • 행복녀 2026.04.10

    그렇게 하면 해결이 될것 같았는데..그래도 줄이 안맞네요 -_-;;
    아 ㅠ.ㅠ

  • 타우러스 2026.04.10

    집어넣을수 없어서 고민보다는...그림대로 이쁘게 줄을 맞추는게 문제였어요^^;;
    테이블로 다 자르고 (겹치는건 두칸으로 자르고..) id와 headers 값으로 접근성을 맞췄는데요
    이미지가...보이는데로...아래위로 줄이 잘 안맞아서...
    양 옆에 긴건...vertical-align:middle로 맞춘후...
    맨 위는 vertical-align:top 으로 맞추고 위에 마진주고..
    아래는 vertical-align:bottom 으로 맞추고 아래 마진 조

  • 남천 2026.04.10

    테이블로 다 짜르고 th scope 적당히 이용하면 고민할 필요 없는거 같은데

  • 세움 2026.04.10

    세로 글씨 눈에 잘 들어 오지도 않네요 @_@;;

  • 나려 2026.04.10

    별다른 방법은 없네요 ㅠ.ㅠ
    이쪽 저쪽 병합해서 붙이고는 있는데...
    각각 align 다 줘도....이미지가 저렇게 깔끔하게 맞지 않습니다 ㅠ.ㅠ
    각각 box에 padding 값을 다 줘야한다는...
    ㅋ 눈물만 나네요 -_-;;;

  • 새나 2026.04.10

    1급부터 6급까지 동일한 내용인것 같은데, 그냥 이미지 덕지덕지 붙이면 되실겁니다.
    저런 테이블이 여러번 나와야 하고 매번 내용이 달라진다면 디자인을 수정하는게 효율적일거예요.

  • 라미 2026.04.10

    고수도 아니고... 퍼블리셔도 아니지만 댓글 달아봅니다.

    일단 테이블로 작성.

    1급,2급,3급,4급,5급,6급, 입문 에 있는 회색선은 table에 BG로 처리.

    가치전파 - 비전실천, 공직윤리, 등등등..... 세로로 된건 rowspan 으로 처리.

    가로로 된건 colspan 으로 처리.

    3,4,5,6 급 등 한 급수에 두개의 항목이 겹치는건 급수 헤더를 rowspan 으로 처리.
    그리고 두개 겹치는 td 는 headers 에 상단 th의 아

프로그램 개발일반 다른 글

목록